1. Selectors
2. Specificity
3. Generated Content
4. Media Queries
5. Debugging
6. Colors & Transparency
7. Fonts / Typography
8. Backgrounds & Borders
9. Gradients
10. Transforms
11. Transitions & Animation
12. Other Features

  color: white;
  color: #fff;
  color: #FFFFFF;
  color: rgb(255,255,255);
  color: rgb(100%,100%,100%);
  color: rgba(255,255,255,1);
  color: rgba(100%,100%,100%, 1);
  color: hsl(0, 100%, 100%);
  color: hsla(0, 100%, 100%, 1);
  color: transparent;
  background-color: currentColor;

• aliceblue #F0F8FF
• antiquewhite #FAEBD7
• aqua/cyan#00FFFF
• aquamarine #7FFFD4
• azure #F0FFFF
• beige #F5F5DC
• bisque #FFE4C4
• black #000000
• blanchedalmond #FFEBCD
• blue #0000FF
• blueviolet #8A2BE2
• brown #A52A2A
• burlywood #DEB887
• cadetblue #5F9EA0
• chartreuse #7FFF00
• chocolate #D2691E
• coral #FF7F50
• cornflowerblue #6495ED
• cornsilk #FFF8DC
• crimson #DC143C
• cyan/aqua#00FFFF
• darkblue #00008B
• darkcyan #008B8B
• darkgoldenrod #B8860B
• darkgray/darkgrey#A9A9A9
• darkgreen #006400
• darkkhaki #BDB76B
• darkmagenta #8B008B
• darkolivegreen #556B2F
• darkorange #FF8C00
• darkorchid #9932CC
• darkred #8B0000
• darksalmon #E9967A
• darkseagreen #8FBC8F
• darkslateblue #483D8B
• darkslategray/darkslategrey #2F4F4F
• darkturquoise #00CED1
• darkviolet #9400D3
• deeppink #FF1493
• deepskyblue #00BFFF
• dimgray/dimgrey #696969
• dodgerblue #1E90FF
• firebrick #B22222
• floralwhite #FFFAF0
• forestgreen #228B22
• fuchsia/magenta#FF00FF
• gainsboro #DCDCDC
• ghostwhite #F8F8FF
• gold #FFD700
• goldenrod #DAA520
• gray/grey #808080
• green #008000
• greenyellow #ADFF2F
• honeydew #F0FFF0
• hotpink #FF69B4
• indianred #CD5C5C
• indigo #4B0082
• ivory #FFFFF0
• khaki #F0E68C
• lavender #E6E6FA
• lavenderblush #FFF0F5
• lawngreen #7CFC00
• lemonchiffon #FFFACD
• lightblue #ADD8E6
• lightcoral #F08080
• lightcyan #E0FFFF
• lightgoldenrodyellow #FAFAD2
• lightgray/lightgrey#D3D3D3
• lightgreen #90EE90
• lightpink #FFB6C1
• lightsalmon #FFA07A
• lightseagreen #20B2AA
• lightskyblue #87CEFA
• lightslategray/lightslategrey #778899
• lightsteelblue #B0C4DE
• lightyellow #FFFFE0
• lime #00FF00
• limegreen #32CD32
• linen #FAF0E6
• maroon #800000
• mediumaquamarine #66CDAA
• mediumblue #0000CD
• mediumorchid #BA55D3
• mediumpurple #9370DB
• mediumseagreen #3CB371
• mediumslateblue #7B68EE
• mediumspringgreen #00FA9A
• mediumturquoise #48D1CC
• mediumvioletred #C71585
• midnightblue #191970
• mintcream #F5FFFA
• mistyrose #FFE4E1
• moccasin #FFE4B5
• navajowhite #FFDEAD
• navy #000080
• oldlace #FDF5E6
• olive #808000
• olivedrab #6B8E23
• orange #FFA500
• orangered #FF4500
• orchid #DA70D6
• palegoldenrod #EEE8AA
• palegreen #98FB98
• paleturquoise #AFEEEE
• palevioletred #DB7093
• papayawhip #FFEFD5
• peachpuff #FFDAB9
• peru #CD853F
• pink #FFC0CB
• plum #DDA0DD
• powderblue #B0E0E6
• purple #800080
• red #FF0000
• rosybrown #BC8F8F
• royalblue #4169E1
• saddlebrown #8B4513
• salmon #FA8072
• sandybrown #F4A460
• seagreen #2E8B57
• seashell #FFF5EE
• sienna #A0522D
• silver #C0C0C0
• skyblue #87CEEB
• slateblue #6A5ACD
• slategray/slategrey #708090
• snow #FFFAFA
• springgreen #00FF7F
• steelblue #4682B4
• tan #D2B48C
• teal #008080
• thistle #D8BFD8
• tomato #FF6347
• turquoise #40E0D0
• violet #EE82EE
• wheat #F5DEB3
• white #FFFFFF
• whitesmoke #F5F5F5
• yellow #FFFF00
• yellowgreen #9ACD32

•   #
• Red 40
• Green BF
• Blue AC

•   rgb(
• Red 64,
• Green 191,
• Blue 172
•   )

•   rgb(
• Red 25%,
• Green 75%,
• Blue 67%
•   )

•   rgba(
• Red 64,
• Green 191,
• Blue 172,
• alpha 0.2
•   )

•   rgba(
• Red 25%,
• Green 75%,
• Blue 67%,
• alpha 0.2
•   )

color:hsla(
   328, 	 H 
blah
   100%, 	 S 

   44%, 	 L 

   1.00 	 A 

);        

Github Repo
Color Picker home page

• Chrome 1
• Safari 1.2
• Firefox 0.9
• Opera 9
• IE 4* / IE 9

opacity: 1;

opacity: 0.75;

opacity: 0.5;

opacity: 0.25;

opacity: 0;

color: rgba(0, 0, 0, 1);
background-color: rgba(58, 103, 171, 1);

color: rgba(0, 0, 0, 0.75);
background-color: rgba(58, 103, 171, 0.75);

color: rgba(0, 0, 0, 0.5;
background-color: rgba(58, 103, 171, 0.5);

color: rgba(0, 0, 0, 0.25);
background-color: rgba(58, 103, 171, 0.25);

color: rgba(0, 0, 0, 0)
background-color: rgba(58, 103, 171, 0);

• Chrome 1
• Safari 1.2
• Firefox 0.9
• Opera 9
• IE 9

• Used in RGBA & HSLA colors

  rgba(58, 103, 171, 0.5);
  hsla(216, 49%, 45%, 0.5);
  

• Transparent Shadows

  .trans { box-shadow: -10px 10px rgba(0,0,0,0.3);
           text-shadow: 0 21px 1px rgba(0,0,0,0.3);}

• Solid Shadows

  .solid { box-shadow: -10px 10px #999;
           text-shadow: 0 21px 1px #999;}

• transparent == rgba(0, 0, 0, 0);
• CurrentColor == current Text color
• Accessibility: Color is NOT the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
• appearance: Changes the appearance of buttons and other controls to resemble native controls.

• button
• button-bevel
• caret
• checkbox
• default-button
• listbox
• listitem
• media-fullscreen-button
• media-mute-button
• media-play-button
• media-seek-back-button
• media-seek-forward-button
• media-slider
• media-sliderthumb
• menulist
• menulist-button
• menulist-text
• menulist-textfield
• none
• push-button
• radio
• searchfield
• searchfield-cancel-button
• searchfield-decoration
• searchfield-results-button
• searchfield-results-decoration
• slider-horizontal
• slider-vertical
• sliderthumb-horizontal
• sliderthumb-vertical
• square-button
• textarea
• textfield
• scrollbarbutton-down
• scrollbarbutton-left
• scrollbarbutton-right
• scrollbarbutton-up
• scrollbargripper-horizontal
• scrollbargripper-vertical
• scrollbarthumb-horizontal
• scrollbarthumb-vertical
• scrollbartrack-horizontal
• scrollbartrack-vertical