Rijk's Website

The CSS lh unit

A look at the CSS line height unit and how it works.

CSS3 Patterns Gallery

The patterns themselves should work on Firefox 3.6+, Chrome, Safari 5.1, Opera 11.10+ and IE10+. However, implementation limitations might cause some of them to not be displayed correctly even on those browsers (for example at the time of writing, Gecko is quite buggy with radial gradients).

CSS is filling the gaps with rules. A way to style gaps in grid and flex. | utilitybend

A practical walkthrough of CSS gap decorations: column-rule, row-rule, rule-break, rule-inset, rule-visibility-items, repeat(), and animation.

Pure CSS halftone patterns: dots, lines, circles

A project overdue. As an 80's/90's kid, I was obsessed with printing technology - and especially halftone patterns. I've long theorized that these pat

Revealing Text With CSS letter-spacing | CSS-Tricks

Until we get something like ::nth-letter, there are still some really cool text effects we can make from existing CSS features, like letter-spacing, ::first-word and ::first-line.

Multiple-column layout, rows, rules, and floats

Recently implemented in Chrome are two of my top asks for CSS—the concept of rows in multiple-column layout, and gap decorations for rows and columns in grid, flexbox, and multicol. Rows (using column-wrap) provide a way to use multicol on the web without risking scrolling up and down to read if the columns become taller than the viewport. Gap decorations mean that, for multicol, you can now add a rule between these new rows. This post is a collection of the things I think would be interesting to do in future. If you think so too, and particularly if you have a great use case for any of these, let me know in the comments.

una.im | Modern CSS theming with light-dark(), contrast-color(), and style queries

Combine three new CSS features to build fully adaptive themed components.

Designing for Colour-Blindness

As always, I’ve been tinkering with the site over the last few weeks. One of the adjustments I made was to remove the underlines from links, which I felt mad...

The Layout Maestro by Ahmad Shadeed

Build any web layout with confidence. Learn practical CSS layout through visual lessons, interactive demos, and a proven layout mindset.

Minimal Mistakes

A flexible two-column Jekyll theme. Perfect for building personal sites, blogs, and portfolios. Latest release v4.28.1

CSS Generators: Your CSS code with less effort

A wide range of CSS Generators to build the future of the web. Add your setting, get your CSS code.