zichy / fieber

Classless and accessible CSS framework

Home Page:https://fieber.hack.re

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

fieber.css

fieber.css is a classless and accessible CSS framework. It combines semantic markup with minimalist, brutalist, and opinionated styles.

Check out the demo site.

Features

  • Based on semantic HTML5 πŸ’•
  • Accessibility-first approach πŸ’ͺ
  • Supports every modern HTML element 🌎
  • Responsive layout πŸ–₯πŸ“±
  • Light/dark theme 🌞🌚
  • Written in vanilla CSS 🍦
  • Just 17 kB unminified 🀏
  • Easily customizable πŸ”§
  • Print styles included πŸ–¨
  • RTL-ready πŸ‘ˆ

Usage

Download the fieber.css file and insert it into the <head> of your website:

<link rel="stylesheet" href="fieber.css">

A npm package may come in the future.

Customization

You can easily change the basic appearance like text and colors by adjusting the custom properties.

Things to keep in mind when using fieber.css:

  • Classless frameworks come with a lot of limitations. Building a more advanced layout is up to you.
  • This framework does not include a full-featured CSS reset. You may want to add styles, e.g. to remove the default margin of text elements.
  • Please ensure an adequate contrast when using custom colors.
  • Right-to-left content is supported by adding dir="rtl" to the <html> tag.
  • The current font stacks may not be perfect for writing systems like Arabic script.
  • Remember to respect your users’ motion preferences when adding animations. (Example)

There are many other classless frameworks that may be better suited for your specific use case.

Browser support

  • Chrome 105 and newer
  • Edge 105 and newer
  • Opera 91 and newer
  • Safari 15.4 and newer
  • Firefox 121 and newer

License

This software is licensed under the MIT License.