The #oklch method might help you to develop #accessible color palettes: https://blog.logrocket.com/oklch-css-consistent-accessible-color-palettes/ #web #webdevelopment #a11y

#Webdesign #Farben

Hab den Nachmittag damit verbracht, mich in den Farbraum #lch ("Lightness, Chroma, Hue") einzuarbeiten.

Hat ein bisschen gedauert, bis ich die Systematik verstanden habe, welchen Wert ich wie verändern kann / muss um ein entsprechendes Ergebnis zu erzielen 😁

Hier mal ein Auszug, der die Unterschiede zeigt, zwischen einem #Browser, der den Farbraum anzeigen kann (#Vivaldi), und einem, der als Fallback auf #HEX zurückgreift und die lch-Werte nicht anzeigen kann (#LibreWolf, ein #Firefox-Fork).

#OKLCH Color Picker & Converter
https://oklch.com/

---

Notation (eher für mich, damit ich es auf dem anderen Notebook habe)

<li style="background: #ff3250;">fallback #ff3250</li>
<li style="background-color: oklch(65.2% 0.295 20);">Peak for hue 20 P3<br><br>max oklch(65.2% 0.295 20) = #ff3250</li>

I managed to file a bug at Webkit, but not at Chromium. If anybody with a google account wants to, feel free to file it there.

☞ https://bugs.webkit.org/show_bug.cgi?id=255939

#css #color #lch #oklch #bug #browser #chrome #chromium

... And a nice tool for converting your existing #hex or #rgb #color values to #oklch.
https://oklch.com/

#css #generators #webdev

#oklch() in the #CSS Color 4 specification looks really promising for easier #color management. It's not quite ready for prime time, but you can already use it with #PostCSS.

Here's a thorough explanation.
https://evilmartians.com/chronicles/oklch-in-css-why-quit-rgb-hsl

#ReleaseThursday This is actually the 2nd bunch of #ThingUmbrella releases since the weekend (which I completely forgot to notify about). The main highlights are:

https://thi.ng/color - added #Oklch support, update #Oklab conversion matrices (to latest spec), updated/improved/fixed CSS color parsing & serializations (more input formats, wider support for using percentages in more places), added serialization options for CSS Color Module Level 4, more docs

https://thi.ng/hiccup-markdown - major new version w/ completely new & extensible parser to transform #Markdown (with custom extensions[1]) into a proper abstract syntax tree and then transform elements via user defined handlers into arbitrary data structures. The default handlers generate a https://thi.ng/hiccup tree. More info in the package readme and the readme of this interactive parser & live preview demo: https://demo.thi.ng/umbrella/markdown/

[1] The syntax extensions include blocks of arbitrary metadata attached to _any_ blocklevel element (e.g. headings, paragraphs, tables, lists etc.) and custom typed blocks of content

As usual, please see changelogs for other updates:

https://github.com/thi-ng/umbrella/blob/develop/README.md#latest-updates

Happy Coding! 😍​

🔺 OKLCH Color Picker & Converter
by @evilmartians
#oklch #color #webdev #webapp #webtool

https://oklch.com
+
OKLCH in CSS: why we moved from RGB and HSL
https://evilmartians.com/chronicles/oklch-in-css-why-quit-rgb-hsl

Advice from watching @svgeesus's "Escaping the sRGB Prison" talk: if you want to polar color mixing use #Oklch, if you want linear color mixing use #Oklab. See also: https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/oklab

CSS color spaces and relative color syntax · New CSS specs will change how we work with color on the web https://ilo.im/100z8k

___
#development #introductions
#webdesign #webdevelopment #webdev #CSS #colorSpace #colorSyntax #color #Oklch #HSL #RGB

My first test for the Web Platform Tests project just got merged! They add a few more tests to test black and white in the (ok)lch colour functions. Can’t wait to use these functions!

https://github.com/web-platform-tests/wpt/pull/34363

#color #colour #lch #oklch #w3c #web