Base Styles is...

1 A clean, Platform First design system.

We've figured out how to make common UI elements (accordions, rich tooltips, dropdowns, modals and more) feel as nice with just HTML & CSS as they do with javascript.

2 A system for keeping your CSS manageable

Prevent avoidable UI inconsistencies over time by keeping your team and your agents tethered to a consistent set of patterns and variables.

Principles

  • Tailwind Compatible: Designed to work alongside Tailwind, not to replace it.
  • Beautiful By Default: Clean, modern styling out of the box.
  • Customizable: Make it your own by tweaking a few CSS variables or using a theme.
  • No Build: Just import the CSS file and start building.
  • Extendable: Want to add something not included with our defaults? Just create a variant.


CSS First, Javascript Optional

Every year, the number of UI elements that need javascript is shrinking. And yet every component library today is needlessly locked in to a specific javascript approach, often depending on heavy meta-frameworks like React. We see a future where people use a CSS foundation like Base Styles, paired with whatever flavour of javascript they use.


Javascript-Free Components


Needs a little Javascript

Next UpGetting Started