CSS Material Colors
CSS library for Material Design Background and Foreground colors
Test it on CodePen: http://codepen.io/badboy/pen/BKPQWr/
1. Download CSS file, it's easy
Simply download the material-colors.css and link to your next HTML project.
2. Import downloaded CSS to your html file
Just import css into your html code between <head> section and set the path to css file, like this:
<html>
<head>
...
<link href="/css/material-colors.css" rel="stylesheet" type="text/css"/>
...
</head>
...
</html>
3. Use & Enjoy the material colors
- You can use the colors by class property on any tags like this:
class="..." - Can be set background color by class:
bg-... - Can be set foreground color by class:
fg-... - May be call a simple color like this:
bg-indigoorfg-pink - And may be call a color tone like this:
bg-deep-purple-700orfg-lime-a200
4. Colors and Tones
- Colors:
-red,-pink,-purple,-deep-purple,-indigo,-blue,-light-blue,-cyan,-teal,-green,-light-green,-lime,-yellow,-amber,-orange,-deep-orange,-brown,-grey,-blue-greyand without tones:-black,-white - Tones:
-50,-100,-200,-300,-400,-500,-600,-700,-800,-900,-a100,-a200,-a400,-a700 - Color palette: https://www.google.com/design/spec/style/color.html#color-color-palette