Baselayer 3

v.3.4.1 • 24 KB (minified) • MIT licence.

Designed as a good place to start, Baselayer may be all you need — for small web projects. Or you may use it as a baselayer to quick-start your mega project.

Ready to use as-is, Baselayer gives you all this:

• A modern CSS reset
• Minimalist styled classless typographic, and form elements
• Reliable accessibility features for assistive technology users
• A lightweight system of utility classes for controlling dimensions, positioning, spacing, borders, text, and images
• @container query responsive layout utilities using CSS grid and flexbox
• Responsive typography, layout, and spacing using clamp() ramps
• A compact color lightnesssystem based on color-mix(in OKLCH) for text, borders, and backgrounds
• Built-in dark mode using light-dark()
• Theming control using CSS variables
• And more

Baselayer uses modern CSS technologies such as grid, functions (e.g. clamp(), color-mix(), light-dark()), var() custom properties, and CSS class nesting. Therefore it supports only Basline: widely available (mid-2023 forward) web browsers such as Safari, Firefox, Chrome, Edge, etc.

Documentation: https://simonpadbury.github.io/baselayer-3/

Changelog: https://github.com/SimonPadbury/baselayer-3/blob/main/README.md

Documentation: https://simonpadbury.github.io/baselayer-3/