Skip to the content.

css-init

♿️ A minimal, accessible, & unopinionated CSS reset that correctly accounts for HTML5 elements

License: MIT npm version npm weekly downloads

⚙️ Features

👌 Minimal

♿️ Accessible

🤫 Unopinionated

📱 Modern

🏗 Browser Support

The styles in this project are compiled using rules that support the last 2 versions, and any version with coverage greater than 1%, of all modern browsers supported by Browserslist.

> 1%
last 2 versions

😞 Why

After years of creating a custom _reset.scss file on top of Reset CSS and Normalize, I decided to research what other options are available… surely there has to be a minimal, accessible, unopinionated, modern alternative? And here enters my disappointment - while there are some notable newer options, I couldn’t find anything that ticked all the above boxes. So here is my best attempt at creating a stylesheet that does so.

⤵️ Install

css-init NPM package

With NPM:

$ npm i css-init

With Yarn:

$ yarn add css-init

Download

🛠 Usage

📝 NOTE: Replace “..node-modules” below with the path to your /node_modules/ directory, or in your desired location.

HTML:

<link rel="stylesheet" href="..node-modules/css-init/dist/init.min.css">

SCSS:

@import '..node-modules/css-init/src/init.scss';

CSS:

@import '..node-modules/css-init/dist/init.min.css';

Via webpack and css-loader:

import 'css-init';

💣 Testing

There is an included elements.html file that acts as an example/test page. You can load this file locally in any browser to see how all HTML elements will look after the css-init styles are loaded.

👥 GitHub

✏️ Contributing

This project is open-source, and can only get better the more people use it and contribute to it (code contributions and issues/bugs/ideas are all encouraged).

❤️ Feedback is welcome!

To submit any issues, bugs, or ideas for improvement please open a new issue on GitHub.

📄 License

MIT