https://github.com/stackcss/css-scale
Scalar CSS variables
https://github.com/stackcss/css-scale
Last synced: 10 months ago
JSON representation
Scalar CSS variables
- Host: GitHub
- URL: https://github.com/stackcss/css-scale
- Owner: stackcss
- License: mit
- Created: 2015-09-29T13:36:31.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2015-09-29T13:36:48.000Z (over 10 years ago)
- Last Synced: 2025-01-23T11:48:09.861Z (12 months ago)
- Language: CSS
- Size: 105 KB
- Stars: 5
- Watchers: 7
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# css-scale
[![NPM version][npm-image]][npm-url]
[![Downloads][downloads-image]][downloads-url]
Scalar CSS variables. Useful to quickly prototype interfaces using consistent
values. Extracted from [gravitons](http://jxnblk.com/gravitons).
## Installation
```sh
$ npm install css-scale
```
## Usage
With [sheetify](https://github.com/sheetify/sheetify) installed do:
```css
@import 'css-scale';
h1 {
font-size: var(--h1);
}
.title {
padding: var(--s2);
}
```
## API
### s{1..4}
A size value in `rem`. Useful for setting margins, offsets and other sizes.
### h{1..6}
A heading value in `rem`. Useful for setting font-sizes and line-heights.
## See Also
- [css-wipe](https://github.com/sheetify/css-wipe)
- [sheetify](https://github.com/sheetify/sheetify)
## License
[MIT](https://tldrlegal.com/license/mit-license)
[npm-image]: https://img.shields.io/npm/v/css-scale.svg?style=flat-square
[npm-url]: https://npmjs.org/package/css-scale
[downloads-image]: http://img.shields.io/npm/dm/css-scale.svg?style=flat-square
[downloads-url]: https://npmjs.org/package/css-scale
[standard-image]: https://img.shields.io/badge/code%20style-standard-brightgreen.svg?style=flat-square
[standard-url]: https://github.com/feross/standard