Simple responsive boilerplate to kickstart your project
heki.css provides a minimal set of styles for a clean start at only 2.5kb gzipped. It is intentionally not a UI framework and a great start if you feel that you don't need all the functionality provided by a larger framework.
- Using CSS variables (for example: --primary-color: blue)
- Simplifies customizing of boilerplate
- Offers easy themeing capabilities
- Change via Javascript
- Consistenly using margin-bottom only (even in reset)
- Responsive font-size using a modular type scale
- It is just vanilla CSS, no compile step required
The easist way to get started is to download the latest release.
$ npm install heki.css
<html>
<head>
<link rel="stylesheet" href="//cdn.rawgit.com/fdietz/heki.css/master/dist/heki.min.css">
</head>
<body>
<h1>Welcome to heki.css!</h1>
</body>
</html>
- Chrome latest
- Firefox latest
- Opera latest
- Safari latest
- Edge
You can use heki.css today if you can ignore Internet Explorer. Edge is fine though.
This mostly comes down to support for CSS variables. If you need to support Internet Explorer consider using a Polyfill myth or similar. To makes things simpler for now, heki.css only uses css variables at the :root scope.
Lot's of inspiration from minimal frameworks as for example milligram or skeleton.
The reset is based on Bootstrap 4 Reboot and adapted to use CSS variables.
Awesome articles as for example Locally scoped CSS variables: What, how, and why by Una Kravets.