Pattern library

A small sampler of components

As it stands, this section is deliberately simple and essential: not a sprawling library, but a small sample of components that come up frequently in everyday work.

The goal is to give you a first practical approach to common interface elements — a menu, a form, a card, a reading index — built with clean code and a careful eye on accessibility.

Use them as a starting point to study, take apart and reshape however you like, adapting them step by step to what your own projects need. Every page includes an interactive demo, a few usage notes and the source code ready to read.

Right now there's the reading index that follows the page as you scroll, the content card, the accessible header with its mobile menu, and the validated form. They're written to be read before they're copied, so next to the code you'll also find the reason behind certain choices: the ARIA attributes, the keyboard focus handling in the menu, the error states in the form. The properties you see in use are explained one by one in the CSS glossary.