Top all-time · #1124
Björn Ottosson
Personal blog · bottosson.github.iodesignscience
Björn Ottosson's personal blog at bottosson.github.io covers design and science. Since 2020, 64 different Hacker News readers have linked it 87 times, most often “Oklab: A perceptual color space for image processing”. The last post was in 2021, but the archive is still widely read.
Björn Ottosson's blog.
Most-linked posts?
- Oklab: A perceptual color space for image processing38 people · 42 mentions · first linked 2020-12-24
- New alternatives to HSL and HSV that better match color perception12 people · 14 mentions · first linked 2021-09-08
- Interactive Color Picker Comparison5 people · 6 mentions · first linked 2021-09-08
- sRGB Gamut Clipping (2021)5 people · 5 mentions · first linked 2021-01-25
- How software gets color wrong4 people · 4 mentions · first linked 2020-12-24
What Hacker News says?
Not quite—you can choose a ramp that will remain in-gamut for sRGB, eg try shifting hue here: https://oklch.com/#72.67,0.121,240.19,100 Even if you were to use a more saturated ramp, I suspect that discontinuities due to gamut mapping with a good algorithm[1] should be less than the discontinuities due to lightness and chroma shifts in HSL, but I could be wrong. [1] https://bottosson.github.io/posts/gamutclipping/
Comment linking /posts/gamutclipping/
on “Is My Blue Your Blue?”Submitted New alternatives to HSL and HSV that better match color perception as a story · 398 points
HN discussionhttps://bottosson.github.io/misc/colorpicker/#738951 wow, the "Ok" family is clearly much better at modeling human perception.
Comment linking /misc/colorpicker/
on “CSS Gradients that avoid the “gray dead zone””Submitted Oklab: A perceptual color space for image processing as a story · 236 points
HN discussionOr likely better, Okhsl and Okhsv: https://bottosson.github.io/posts/colorpicker/
Comment linking /posts/colorpicker/
on “CSS Gradients that avoid the “gray dead zone””Submitted sRGB Gamut Clipping (2021) as a story · 90 points
HN discussionThis fantastic article proposes new colorspaces (okhsl, oklab) for color pickers and is worth the read for anyone interested in color: https://bottosson.github.io/posts/colorpicker/ Many similar problems to solve as in the gradient generator, but approached from a different point of view, and with some novel ideas.
Comment linking /posts/colorpicker/
on “CSS Gradients that avoid the “gray dead zone””Submitted Two new color spaces for color picking – Okhsv and Okhsl as a story · 4 points
HN discussionThere most definitely is perceptual hue shift in HSL (and HSV); it's illustrated quite well at [0](The blog of the creator of OKLab), particularly in [1], an image showing S and L axes while leaving H fixed. [0] https://bottosson.github.io/posts/colorpicker/ [1] https://bottosson.github.io/img/colorpicker/hsl_blue.png
Comment linking /img/colorpicker/hsl_blue.png
on “What are OKLCH colors?”Submitted How software gets color wrong as a story · 4 points
HN discussionFor others, I'm sure parent knows: OKLCH is largely a bugfix for CILEAB. Both try to make a color space where even steps feel evenly spaced to a human. But CIELAB had procedural flaws in its creation. See slide 19: https://www.w3.org/Graphics/Color/Workshop/slides/talk/lille... -- if you ask CIELAB to make "pure blue" (RGB 0 0 100%) become grayscale, the intermediate colors become purple to the human eye. The entire…
Comment linking /posts/oklab/
on “What are OKLCH colors?”Submitted sRGB gamut clipping as a story · 4 points
HN discussionHere's the original post explaining the color space. The ideas are very similar, OKLAB used a different white point https://bottosson.github.io/posts/oklab/#what-about-existing...
Comment linking /posts/oklab/
on “What are OKLCH colors?”Submitted SRGB gamut clipping – a better alternative to clipping RGB values as a story · 3 points
HN discussionFor historical "neat" factor, here's the original blog post that introduced the color space: https://bottosson.github.io/posts/oklab/
Comment linking /posts/oklab/
on “What are OKLCH colors?”Submitted A perceptual color space for image processing (2020) as a story · 2 points
HN discussionCreator of OKLCH on OKLCH: https://bottosson.github.io/posts/oklab/
Comment linking /posts/oklab/
on “What are OKLCH colors?”Submitted Interactive Color Picker Comparison as a story · 2 points
HN discussionNice post. OKLCH is quite handy but for writing colors in CSS I hope eventually we’ll get some form of OKHSL/OKHSV[1] so users don’t need to worry about gamut boundaries. [1] https://bottosson.github.io/posts/colorpicker/
Comment linking /posts/colorpicker/
on “What are OKLCH colors?”Submitted Software Gets Color Wrong as a story · 2 points
HN discussionI really liked this article: https://bottosson.github.io/posts/oklab/ OKLAB is a perceptual colour space, which is really useful for things like colour-picker tools, image editor controls, web development, CSS styles, etc... You can use this kind of colour space to make two colours that are equally bright and equally saturated, but exactly 180 degrees apart on the colour wheel. If you use this instead of RGB hex cod…
Comment linking /posts/oklab/
on “The worst volume control UI in the world (2017)”Submitted A perceptual color space for image processing as a story · 1 points
HN discussionFor color picking, I have just released two new color spaces based on Oklab, trying to improve on HSV and HSL. You can try them and compare with other options here: https://bottosson.github.io/misc/colorpicker/
Comment linking /misc/colorpicker/
on “My Room in 3D”Submitted Okhsv and Okhsl: two new color spaces for color picking. (2021) as a story · 1 points
HN discussionThe #1 best "Blender tip" (that also applies to computer graphics in general), is that by default it is horribly incorrect with its treatment of colour spaces and especially gamma/tonemapping. Rather than me clumsily explaining with text how to get this right and have your artwork "pop" with very little effort, watch this video titled "The Secret Ingredient to Photorealism": https://www.youtube.com/watch?v=m9AT7H4GG…
Comment linking /posts/oklab/
on “My Room in 3D”Submitted Okhsv and Okhsl: Two new color spaces for color picking (2021) as a story · 1 points
HN discussionI just found out that `lch()`, `lab()`, `oklch()` and `oklab()` are already supported in Safari (stable)[1]. The normal versions have a white point of 50 and the ok versions have a white point of 65, which is the same as sRGB[2]. [1]: https://wpt.fyi/results/css/css-color?label=stable&label=mas... [2]: https://bottosson.github.io/posts/oklab/
Comment linking /posts/oklab/
on “Web color is still broken”Submitted A perceptual color space for image processing as a story · 1 points
HN discussionGradients are design tools. The gradient interpolation function can be designed around some physical mixing hypothesis but there is no first principles rule as such. Focusing on the luminosity is only half of the battle. For nice looking gradients that are pleasing to design with, generally for aesthetic reasons you also want the perceived color saturation to be interpolated in a predictable way. For reference, here…
Comment linking /posts/oklab/
on “Web color is still broken”Submitted A perceptual color space for image processing as a story · 1 points
HN discussion