Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/zavoloklom/material-design-color-palette

Material Design Color Palette: LESS/CSS toolkit
https://github.com/zavoloklom/material-design-color-palette

Last synced: about 1 month ago
JSON representation

Material Design Color Palette: LESS/CSS toolkit

Lists

README

        

# [Material Design Color Palette 1.1.0](http://zavoloklom.github.io/material-design-color-palette)

[![Latest Version](https://img.shields.io/github/release/zavoloklom/material-design-color-palette.svg?style=flat-square&label=latest version)](https://github.com/zavoloklom/material-design-color-palette/tags)
[![Software License](https://img.shields.io/badge/license-MIT License-blue.svg?style=flat-square)](LICENSE)
[![Total Downloads](https://img.shields.io/github/downloads/zavoloklom/material-design-color-palette/latest/total.svg)](https://github.com/zavoloklom/material-design-color-palette/tags)

[![NPM](https://img.shields.io/npm/v/material-design-color-palette.svg?style=flat-square)](https://www.npmjs.com/package/material-design-color-palette)
[![Dependency](https://img.shields.io/david/zavoloklom/material-design-color-palette.svg?style=flat-square)](https://david-dm.org/zavoloklom/material-design-color-palette)
[![DevDependency](https://img.shields.io/david/dev/zavoloklom/material-design-color-palette.svg?style=flat-square)](https://david-dm.org/zavoloklom/material-design-color-palette#info=devDependencies)
[![Last Month Downloads](https://img.shields.io/npm/dm/material-design-color-palette.svg?style=flat-square)](https://www.npmjs.com/package/material-design-color-palette)

[![Material Design Color Palette](http://zavoloklom.github.io/material-design-color-palette/img/Material-Design-Color-Palette.png)](http://zavoloklom.github.io/material-design-color-palette/)

### Material Design Color Palette: LESS/CSS toolkit

Color palette created and maintained by [Google](http://www.google.com/design/spec/style/color.html#color-color-palette).

This color palette comprises primary and accent colors that can be used for illustration or to develop your brand colors. They’ve been designed to work harmoniously with each other.

Get started at [http://zavoloklom.github.io/material-design-color-palette](http://zavoloklom.github.io/material-design-color-palette)

Download: [1.1.0 (ZIP)](https://github.com/zavoloklom/material-design-color-palette/releases/download/1.1.0/material-design-color-palette.zip)

### Install
**Bower:** `bower install material-design-color-palette`

### Getting started
#### BASIC: Default CSS
Use this method to get the default Material Design Color Palette CSS.
- Download latest version of Material Design Color Palette.
- Unpack the entire `material-design-color-palette` archive into your project.
- In the of your html, reference the location to your material-design-color-palette.min.css.
``
- Check out the [Examples pages](http://zavoloklom.github.io/material-design-color-palette/examples.html) to start using Material Design Color Palette!

#### PRO: Custom LESS
Use this method to customize Material Design Color Palette using LESS.
- Download latest version of Material Design Color Palette.
- Unpack the entire `material-design-color-palette` archive into your project.
- Open your project's `path/to/material-design-color-palette/less/variables/colors.less` to change HEX values.
- Open your project's `path/to/material-design-color-palette/less/variables/main.less` to change prefixes `@zmdc-css-prefix`, `@zmdc-text-prefix` and `@zmdc-bg-prefix`.

> Css class template: {@zmdc-css-prefix}-{@zmdc-text-prefix or @zmdc-bg-prefix}-{color name}-{color value}.
> Example: mdc-text-red-400

- Re-compile your LESS if using a static compiler.
- Check out the [Examples pages](http://zavoloklom.github.io/material-design-color-palette/examples.html) to start using Material Design Color Palette!

### License
- Material Design Color Palette CSS and LESS files are licensed under the MIT License:
- http://opensource.org/licenses/mit-license.html
- Full details: [License page](http://zavoloklom.github.io/material-design-color-palette/license.html)

### Changelog
- 1.1.0 - add some changes into LESS mixins and variables
- 1.0.0 - add all colors from [Google](http://www.google.com/design/spec/style/color.html#color-color-palette)

### Versioning
Material Design Color Palette will be maintained under the Semantic Versioning guidelines as much as possible. Releases will be numbered with the following format:

`..`

And constructed with the following guidelines:

* New colors from Google or changes that breaking backward compatibility bumps the major (and resets the minor and patch)
* New additions without breaking backward compatibility bumps the minor (and resets the patch)
* Bug fixes and misc changes bumps the patch

For more information on SemVer, please visit http://semver.org.

### Author
- Email: [email protected]
- Twitter: https://twitter.com/zavoloklom
- GitHub: https://github.com/zavoloklom
- CodePen: http://codepen.io/zavoloklom
- Dribble: https://dribbble.com/zavoloklom

### Donate
- You can support me via [PayPal](https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=s%2ekupletsky%40gmail%2ecom&lc=US&item_name=Material%20Design%20Color%20Palette&currency_code=USD&bn=PP%2dDonationsBF%3abtn_donateCC_LG%2egif%3aNonHosted), [WebMoney](https://funding.webmoney.ru/material-design-web-projects) or [Gratipay](http://gratipay.com/zavoloklom/)