https://github.com/raulghm/multi-brand-colors
Multi Brand Colors with support for CSS/CSS-Vars/SCSS/SASS/Stylus/LESS/JSON
https://github.com/raulghm/multi-brand-colors
brand color colors css css-variables json less multi-brand-colors postcss sass scss stylus w3c
Last synced: 8 months ago
JSON representation
Multi Brand Colors with support for CSS/CSS-Vars/SCSS/SASS/Stylus/LESS/JSON
- Host: GitHub
- URL: https://github.com/raulghm/multi-brand-colors
- Owner: raulghm
- Created: 2014-03-10T18:32:32.000Z (about 12 years ago)
- Default Branch: master
- Last Pushed: 2017-02-21T18:32:58.000Z (over 9 years ago)
- Last Synced: 2025-04-15T14:05:00.032Z (about 1 year ago)
- Topics: brand, color, colors, css, css-variables, json, less, multi-brand-colors, postcss, sass, scss, stylus, w3c
- Language: HTML
- Homepage: https://github.com/raulghm/multi-brand-colors
- Size: 121 KB
- Stars: 27
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Multi Brand Colors
===================
> Multi Brand Colors with support for CSS/CSS-Vars/SCSS/SASS/Stylus/LESS/JSON
#### Bower support
```
bower install --save multi-brand-colors
```
#### NPM support
```
npm install --save multi-brand-colors
```
## How use
### CSS
```html
Document
Lorem ipsum dolor.
Lorem ipsum dolor.
```
### W3C CSS Variables
About CSS Variables:
[www.w3.org/TR/css-variables](http://www.w3.org/TR/css-variables/)
How use with PostCSS:
[github.com/postcss/postcss-custom-properties](https://github.com/postcss/postcss-custom-properties)
```css
@import 'bower_components/multi-brand-colors/dist/css-vars/index.css';
// or
@import 'multi-brand-colors';
.div {
color: var(--mbc-twitter);
}
```
### SCSS
```scss
@import 'bower_components/multi-brand-colors/dist/scss/index.scss';
.div {
color: $mbc-twitter;
}
```
### SASS
```sass
@import 'bower_components/multi-brand-colors/dist/sass/index.sass'
.div {
color: $mbc-twitter
}
```
### LESS
```less
@import 'bower_components/multi-brand-colors/dist/less/index.less';
.div {
color: @mbc-twitter;
}
```
### Stylus
```styl
@import bower_components/multi-brand-colors/dist/stylus/index.styl
.div
color $mbc-twitter
```
### JSON
```javascript
// simple example
var json = require('./dist/json/index.json');
console.log(json);
```