Pure css color palette using OKLCH

A Web Developer based in Belgium, specialized in PHP & JS development
Search for a command to run...

A Web Developer based in Belgium, specialized in PHP & JS development
No comments yet. Be the first to comment.
I recently needed to collect all changes in one file for reporting purposes. Found this article: https://ratfactor.com/cards/git-diff-with-new-files In case you need something similar on Windows, here

Some projects start with a grand plan. Others start because you just need to read a file without thinking too much about it. That was the case for spread-compat. I needed a common interface for CSV, X

With modern css, you can almost get rid of sass. But there is one last pain point : media queries. Not being able to use variables or an easy, common syntax for typical breakpoints is really annoying. That is, until you meet Media Queries Level 5. I’...

This is a quick article to share this demo I just made. https://codepen.io/lekoalabe/pen/JoPNWpX

Modals are typical UI elements for many web apps. There are countless packages dedicated to that specific features, each framework creating its own variation. Popular frameworks like Bootstrap also have custom code to deal with it. But all this feels...

With OKLCH support being now supported in all major browsers, it is time to give a chance to the new OKLCH color. If you don't know what this is, please read this wonderful article by evil martians.
It is now easier than ever to create a color palette system using just a handful of css variables. Simply set the lightness from 0 to 100%, then, set up your chroma (an average value of 0.2 works well, but you might want to lower this to 0.10 or 0.15 for softer tones, or crank it up to 0.3 or more for vivid colors), and your hue (starting with 0 being pink, then move it up to 360... being pink again. Increments between 25 and 50 work well).... and you are good to go!
Here is a simple example with APCA contrast value being written in it to assess accessibility.