2.6 KiB


readable.css is a CSS framework, but not like the others you've seen. Rather than helping you build a sitewide design, readable.css provides a base default that is both sensible and beautiful. Out of the box features include:

  • Light and dark mode (manually or via prefers-color-scheme)
    • High contrast support (manually or prefers-contrast: high)
  • Responsive design
  • Vertical rhythm
  • Headers, footers, and navigation bars
  • Beautiful images, blockquotes, asides, tables, and forms
  • Text justification (off by default)
  • Native font support (serif, sans-serif, or monospace)

Features you will intentionally not find:

  • Flashy animations
  • Custom fonts
  • Utility classes
  • Anything that overrides your users' browser settings

The key design principle of readable.css is consistency. Colors, font-style, border widths, line heights, and everything else are consistent through the entire site.

Sites Using readable.css

If you have a site you're using readable.css on, submit an issue to tell us about it and we may add it here! Be sure to add a testimonial; we're considering adding a section with testimonials to the demo page, and if we like yours we'll add it when we do so!


We're working on a guide to contributing. For now, feel free to make pull requests, but understand that all contributions must be licensed under BSD0 for us to accept them. We will obtain confirmation of this from you before merging your changes.

We also highly suggest making an issue before you start work on adding a new feature or fixing a bug (unless that issue already exists) so we can discuss the best way to proceed before you begin.

Thanks for considering contributing to this project!