heki.css
v1.0.0
Published
Simple responsive boilerplate to kickstart your project
Downloads
4
Maintainers
Readme
heki.css
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.
Motivation
- 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
Getting started
Download
The easist way to get started is to download the latest release.
heki.css is available via npm
$ npm install heki.css
Add the stylesheet link tag in the head.
<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>
Browser Support
- 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.
Credit
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.