I had no thought this was coming but it surely’s fairly neat! Chrome has shipped the EyeDropper API in v95 (Canary, as I write).
🎨 Loving the brand new `EyeDropper` Internet API:
“`js
await new EyeDropper().open();
// Returns the picked shade, e.g.,
// { “sRGBHex”: “#ddd9e0” }
“`
Strive it in Chrome 95. pic.twitter.com/990uyvOngp
— Thomas Steiner (@tomayac) September 1, 2021
EyeDropper API is now accessible on @googlechrome canary (95), tremendous cool method to create a “shade picker”.
Take a look on the codepen for API and instance 🙂https://t.co/Lo6afsnr4w
Video alt:
An instance of EyeDropper api utilizing the instance#JavaScript #100DaysOfCode #FrontEnd pic.twitter.com/W2TopAE2eH
— Matan Borenkraout (@matanbobi) August 31, 2021
I like the way it can seize a shade from wherever on the display screen, not simply throughout the browser window. Possibly Figma could make use of it, as I’ve been pissed off up to now how one can solely snag colours from the Figma working space, not wherever on the display screen.
As a method to join this to another newfangled tech, try this Pen from Andrew Walpole (in Chrome 95+):
It makes use of the EyeDropper API, however petite-vue is the app framework in use, and to my eyes, it’s an awfully elegant expression of an interactive app. This new model of Vue is kind of new meant for use straight within the browser. I see it capturing some devs’ consideration. Listed below are Dave Rupert’s ideas in addition to what Andrew Welch’s thinks about it.
The put up EyeDropper API Dropped appeared first on CSS-Methods. You’ll be able to help CSS-Methods by being an MVP Supporter.
Subscribe to MarketingSolution.
Receive web development discounts & web design tutorials.
Now! Lets GROW Together!