Schnelle Neuigkeiten! Es gibt eine neue Web-API namens EyeDropper
if ('EyeDropper' in window) {
const eyeDropper = new EyeDropper();
try {
// This has gotta be triggered by a user interaction,
// so consider this pseudo-code.
const result = await eyeDropper.open();
const colorHexValue = result.sRGBHex;
} catch (err) {
// The user escaped the eyedropper mode.
}
}
- Hier ist ein sehr guter Blogbeitrag zur Einführung.
- Sie ist im Moment nur in Chrome und ähnlichen Browsern verfügbar.
- Ich wünschte, ich wüsste besser, wie man solche APIs im Auge behält. Es sieht so aus, als ob sie ursprünglich von Edge kam, dann zu einem Ding der Community Group wurde, wo die Entwurfsspezifikation liegt, die eine öffentliche Überprüfung durchlief, bevor die Veröffentlichung angekündigt wurde (in Chrome), und jetzt ist sie live. Es scheint ein guter Prozess zu sein, aber auch, dass Chrome diesen Prozess praktisch im Alleingang durchziehen kann. Andere Browser müssen nicht einmal ein Wort sagen und sie wird trotzdem veröffentlicht. Gemischte Gefühle, aber meist positiv, besonders weil dies eine kleine Zusatzfunktion ist und nichts, was ich als extrem kritisch für eine Webanwendung betrachten würde.
- Sie können Farben von überall auf Ihrem gesamten Bildschirm auswählen, was großartig ist. Es wird Tools wie Figma verbessern, die einen Farbauswähler haben, aber derzeit auf die Auswahl außerhalb der Leinwand beschränkt sind.
- Es wird bereits in Produktionsanwendungen eingesetzt, wie bei Slides.com und Polypane, was die Benutzererfahrung verbessert. (via Bramus)
- Es gibt eine Chrome-Erweiterung. (wiederum via Bramus)
- Aber hey, vielleicht ist ein Bookmarklet genauso einfach.
- Wenn Sie
<input type="color">verwenden, ist das UI-Popup-Ding dafür (plattformseitig bereitgestellt) im Farbauswähler enthalten (zumindest unter macOS), also das gibt es immer. Das lässt mich denken, dass es überall, wo Sie<input type="color">verwenden, sinnvoll wäre, *auch* eine progressiv verbesserte Schaltfläche direkt daneben anzubieten, um direkt zum Farbauswähler zu gelangen. Hashtag freie Webkomponenten-Idee.