rc-switch/assets/include/color.less

switch ui component for react

// red
@red-100:         #FCC7C3;
@red-200:         #FAA29B;
@red-300:         #F87C73;
@red-400:         #F55F54;
@red-500:         #F44336;
@red-600:         #DC3C31;
@red-700:         #C3362B;
@red-800:         #AB2F26;
@red-900:         #922820;
@red-1000:        #7A221B;

// pink
@pink-100:        #F9BCD1;
@pink-200:        #F58FB2;
@pink-300:        #F06292;
@pink-400:        #EC407A;
@pink-500:        #E91E63;
@pink-600:        #D21B59;
@pink-700:        #BA184F;
@pink-800:        #A31545;
@pink-900:        #8C123B;
@pink-1000:       #750F32;

// orange
@orange-100:        #FFE1B3;
@orange-200:        #FFCC80;
@orange-300:        #FFB74D;
@orange-400:        #FFA726;
@orange-500:        #FF9800;
@orange-600:        #E68900;
@orange-700:        #CC7A00;
@orange-800:        #B36A00;
@orange-900:        #995B00;
@orange-1000:       #804C00;

// yellow
@yellow-100:        #FFFAC5;
@yellow-200:        #FFF69E;
@yellow-300:        #FFF276;
@yellow-400:        #FFEE58;
@yellow-500:        #FFEB3B;
@yellow-600:        #E6D435;
@yellow-700:        #CCBC2F;
@yellow-800:        #B3A529;
@yellow-900:        #998D23;
@yellow-1000:       #80761E;

// green
@green-100:        #CAE8CB;
@green-200:        #A6D8A8;
@green-300:        #82C785;
@green-400:        #67BB6A;
@green-500:        #4CAF50;
@green-600:        #449E48;
@green-700:        #3D8C40;
@green-800:        #357A38;
@green-900:        #2E6930;
@green-1000:       #265828;

// cyan
@cyan-100:      #B3EBF3;
@cyan-200:      #80DEEA;
@cyan-300:      #4DD1E1;
@cyan-400:      #26C6DA;
@cyan-500:      #00BCD4;
@cyan-600:      #00A9BF;
@cyan-700:      #0096AA;
@cyan-800:      #008494;
@cyan-900:      #00717F;
@cyan-1000:     #005E6A;

// blue
@blue-100:      #BDE0FC;
@blue-200:      #91CBFA;
@blue-300:      #64B6F7;
@blue-400:      #42A6F5;
@blue-500:      #2196F3;
@blue-600:      #1E87DB;
@blue-700:      #1A78C2;
@blue-800:      #1769AA;
@blue-900:      #145A92;
@blue-1000:     #114B7A;

// indigo
@indigo-100:      #C6CBE9;
@indigo-200:      #A0A9DB;
@indigo-300:      #7986CC;
@indigo-400:      #5C6BC0;
@indigo-500:      #3F51B5;
@indigo-600:      #3949A3;
@indigo-700:      #324191;
@indigo-800:      #2C397F;
@indigo-900:      #26316D;
@indigo-1000:     #20295B;

// purple
@purple-100:      #E2BFE8;
@purple-200:      #CE94D8;
@purple-300:      #BA68C8;
@purple-400:      #AB47BC;
@purple-500:      #9C27B0;
@purple-600:      #8C239E;
@purple-700:      #7D1F8D;
@purple-800:      #6D1B7B;
@purple-900:      #5E176A;
@purple-1000:     #4E1458;

// brown
@brown-100:      #D7CDC9;
@brown-200:      #BDABA4;
@brown-300:      #A2887F;
@brown-400:      #8D6E63;
@brown-500:      #795548;
@brown-600:      #6D4D41;
@brown-700:      #61443A;
@brown-800:      #553B32;
@brown-900:      #49332B;
@brown-1000:     #3D2B24;

// grey
@grey-100:      #E2E2E2;
@grey-200:      #CFCFCF;
@grey-300:      #BCBCBC;
@grey-400:      #ACACAC;
@grey-500:      #9E9E9E;
@grey-600:      #8E8E8E;
@grey-700:      #7E7E7E;
@grey-800:      #6F6F6F;
@grey-900:      #5F5F5F;
@grey-1000:     #4F4F4F;

// blue-grey
@blue-grey-100:      #D0D9DD;
@blue-grey-200:      #B0BFC6;
@blue-grey-300:      #90A5AE;
@blue-grey-400:      #78909C;
@blue-grey-500:      #607D8B;
@blue-grey-600:      #56717D;
@blue-grey-700:      #4D646F;
@blue-grey-800:      #435861;
@blue-grey-900:      #3A4B53;
@blue-grey-1000:     #303F46;

// dark
@dark-100:      #707070;
@dark-200:      #666666;
@dark-300:      #5C5C5C;
@dark-400:      #4A4A4A;
@dark-500:      #404040;
@dark-600:      #3A3A3A;
@dark-700:      #303030;
@dark-800:      #202020;
@dark-900:      #161616;
@dark-1000:     #0D0D0D;

// white
@white:         #ffffff;
@transparent:       rgba(0,0,0,0);
// bg-color
// red

[bg-color="red"] {
  background-color: @red-500;
}
[bg-color="red 100"] {
  background-color: @red-100;
}
[bg-color="red 200"] {
  background-color: @red-200;
}
[bg-color="red 300"] {
  background-color: @red-300;
}
[bg-color="red 400"] {
  background-color: @red-400;
}
[bg-color="red 500"] {
  background-color: @red-500;
}
[bg-color="red 600"] {
  background-color: @red-600;
}
[bg-color="red 700"] {
  background-color: @red-700;
}
[bg-color="red 800"] {
  background-color: @red-800;
}
[bg-color="red 900"] {
  background-color: @red-900;
}
[bg-color="red 1000"] {
  background-color: @red-1000;
}


// pink
[bg-color="pink"] {
  background-color: @pink-500;
}
[bg-color="pink 100"] {
  background-color: @pink-100;
}
[bg-color="pink 200"] {
  background-color: @pink-200;
}
[bg-color="pink 300"] {
  background-color: @pink-300;
}
[bg-color="pink 400"] {
  background-color: @pink-400;
}
[bg-color="pink 500"] {
  background-color: @pink-500;
}
[bg-color="pink 600"] {
  background-color: @pink-600;
}
[bg-color="pink 700"] {
  background-color: @pink-700;
}
[bg-color="pink 800"] {
  background-color: @pink-800;
}
[bg-color="pink 900"] {
  background-color: @pink-900;
}
[bg-color="pink 1000"] {
  background-color: @pink-1000;
}

// orange
[bg-color="orange"] {
  background-color: @orange-500;
}
[bg-color="orange 100"] {
  background-color: @orange-100;
}
[bg-color="orange 200"] {
  background-color: @orange-200;
}
[bg-color="orange 300"] {
  background-color: @orange-300;
}
[bg-color="orange 400"] {
  background-color: @orange-400;
}
[bg-color="orange 500"] {
  background-color: @orange-500;
}
[bg-color="orange 600"] {
  background-color: @orange-600;
}
[bg-color="orange 700"] {
  background-color: @orange-700;
}
[bg-color="orange 800"] {
  background-color: @orange-800;
}
[bg-color="orange 900"] {
  background-color: @orange-900;
}
[bg-color="orange 1000"] {
  background-color: @orange-1000;
}


// yellow
[bg-color="yellow"] {
  background-color: @yellow-500;
}
[bg-color="yellow 100"] {
  background-color: @yellow-100;
}
[bg-color="yellow 200"] {
  background-color: @yellow-200;
}
[bg-color="yellow 300"] {
  background-color: @yellow-300;
}
[bg-color="yellow 400"] {
  background-color: @yellow-400;
}
[bg-color="yellow 500"] {
  background-color: @yellow-500;
}
[bg-color="yellow 600"] {
  background-color: @yellow-600;
}
[bg-color="yellow 700"] {
  background-color: @yellow-700;
}
[bg-color="yellow 800"] {
  background-color: @yellow-800;
}
[bg-color="yellow 900"] {
  background-color: @yellow-900;
}
[bg-color="yellow 1000"] {
  background-color: @yellow-1000;
}

// green
[bg-color="green"] {
  background-color: @green-500;
}
[bg-color="green 100"] {
  background-color: @green-100;
}
[bg-color="green 200"] {
  background-color: @green-200;
}
[bg-color="green 300"] {
  background-color: @green-300;
}
[bg-color="green 400"] {
  background-color: @green-400;
}
[bg-color="green 500"] {
  background-color: @green-500;
}
[bg-color="green 600"] {
  background-color: @green-600;
}
[bg-color="green 700"] {
  background-color: @green-700;
}
[bg-color="green 800"] {
  background-color: @green-800;
}
[bg-color="green 900"] {
  background-color: @green-900;
}
[bg-color="green 1000"] {
  background-color: @green-1000;
}

// cyan
[bg-color="cyan"] {
  background-color: @cyan-500;
}
[bg-color="cyan 100"] {
  background-color: @cyan-100;
}
[bg-color="cyan 200"] {
  background-color: @cyan-200;
}
[bg-color="cyan 300"] {
  background-color: @cyan-300;
}
[bg-color="cyan 400"] {
  background-color: @cyan-400;
}
[bg-color="cyan 500"] {
  background-color: @cyan-500;
}
[bg-color="cyan 600"] {
  background-color: @cyan-600;
}
[bg-color="cyan 700"] {
  background-color: @cyan-700;
}
[bg-color="cyan 800"] {
  background-color: @cyan-800;
}
[bg-color="cyan 900"] {
  background-color: @cyan-900;
}
[bg-color="cyan 1000"] {
  background-color: @cyan-1000;
}

// blue
[bg-color="blue"] {
  background-color: @blue-500;
}
[bg-color="blue 100"] {
  background-color: @blue-100;
}
[bg-color="blue 200"] {
  background-color: @blue-200;
}
[bg-color="blue 300"] {
  background-color: @blue-300;
}
[bg-color="blue 400"] {
  background-color: @blue-400;
}
[bg-color="blue 500"] {
  background-color: @blue-500;
}
[bg-color="blue 600"] {
  background-color: @blue-600;
}
[bg-color="blue 700"] {
  background-color: @blue-700;
}
[bg-color="blue 800"] {
  background-color: @blue-800;
}
[bg-color="blue 900"] {
  background-color: @blue-900;
}
[bg-color="blue 1000"] {
  background-color: @blue-1000;
}

// indigo
[bg-color="indigo"] {
  background-color: @indigo-500;
}
[bg-color="indigo 100"] {
  background-color: @indigo-100;
}
[bg-color="indigo 200"] {
  background-color: @indigo-200;
}
[bg-color="indigo 300"] {
  background-color: @indigo-300;
}
[bg-color="indigo 400"] {
  background-color: @indigo-400;
}
[bg-color="indigo 500"] {
  background-color: @indigo-500;
}
[bg-color="indigo 600"] {
  background-color: @indigo-600;
}
[bg-color="indigo 700"] {
  background-color: @indigo-700;
}
[bg-color="indigo 800"] {
  background-color: @indigo-800;
}
[bg-color="indigo 900"] {
  background-color: @indigo-900;
}
[bg-color="indigo 1000"] {
  background-color: @indigo-1000;
}

// purple
[bg-color="purple"] {
  background-color: @purple-500;
}
[bg-color="purple 100"] {
  background-color: @purple-100;
}
[bg-color="purple 200"] {
  background-color: @purple-200;
}
[bg-color="purple 300"] {
  background-color: @purple-300;
}
[bg-color="purple 400"] {
  background-color: @purple-400;
}
[bg-color="purple 500"] {
  background-color: @purple-500;
}
[bg-color="purple 600"] {
  background-color: @purple-600;
}
[bg-color="purple 700"] {
  background-color: @purple-700;
}
[bg-color="purple 800"] {
  background-color: @purple-800;
}
[bg-color="purple 900"] {
  background-color: @purple-900;
}
[bg-color="purple 1000"] {
  background-color: @purple-1000;
}

// brown
[bg-color="brown"] {
  background-color: @brown-500;
}
[bg-color="brown 100"] {
  background-color: @brown-100;
}
[bg-color="brown 200"] {
  background-color: @brown-200;
}
[bg-color="brown 300"] {
  background-color: @brown-300;
}
[bg-color="brown 400"] {
  background-color: @brown-400;
}
[bg-color="brown 500"] {
  background-color: @brown-500;
}
[bg-color="brown 600"] {
  background-color: @brown-600;
}
[bg-color="brown 700"] {
  background-color: @brown-700;
}
[bg-color="brown 800"] {
  background-color: @brown-800;
}
[bg-color="brown 900"] {
  background-color: @brown-900;
}
[bg-color="brown 1000"] {
  background-color: @brown-1000;
}

// grey
[bg-color="grey"] {
  background-color: @grey-500;
}
[bg-color="grey 100"] {
  background-color: @grey-100;
}
[bg-color="grey 200"] {
  background-color: @grey-200;
}
[bg-color="grey 300"] {
  background-color: @grey-300;
}
[bg-color="grey 400"] {
  background-color: @grey-400;
}
[bg-color="grey 500"] {
  background-color: @grey-500;
}
[bg-color="grey 600"] {
  background-color: @grey-600;
}
[bg-color="grey 700"] {
  background-color: @grey-700;
}
[bg-color="grey 800"] {
  background-color: @grey-800;
}
[bg-color="grey 900"] {
  background-color: @grey-900;
}
[bg-color="grey 1000"] {
  background-color: @grey-1000;
}

// blue-grey
[bg-color="blue-grey"] {
  background-color: @blue-grey-500;
}
[bg-color="blue-grey 100"] {
  background-color: @blue-grey-100;
}
[bg-color="blue-grey 200"] {
  background-color: @blue-grey-200;
}
[bg-color="blue-grey 300"] {
  background-color: @blue-grey-300;
}
[bg-color="blue-grey 400"] {
  background-color: @blue-grey-400;
}
[bg-color="blue-grey 500"] {
  background-color: @blue-grey-500;
}
[bg-color="blue-grey 600"] {
  background-color: @blue-grey-600;
}
[bg-color="blue-grey 700"] {
  background-color: @blue-grey-700;
}
[bg-color="blue-grey 800"] {
  background-color: @blue-grey-800;
}
[bg-color="blue-grey 900"] {
  background-color: @blue-grey-900;
}
[bg-color="blue-grey 1000"] {
  background-color: @blue-grey-1000;
}

// dark
[bg-color="dark"] {
  background-color: @dark-500;
}
[bg-color="dark 100"] {
  background-color: @dark-100;
}
[bg-color="dark 200"] {
  background-color: @dark-200;
}
[bg-color="dark 300"] {
  background-color: @dark-300;
}
[bg-color="dark 400"] {
  background-color: @dark-400;
}
[bg-color="dark 500"] {
  background-color: @dark-500;
}
[bg-color="dark 600"] {
  background-color: @dark-600;
}
[bg-color="dark 700"] {
  background-color: @dark-700;
}
[bg-color="dark 800"] {
  background-color: @dark-800;
}
[bg-color="dark 900"] {
  background-color: @dark-900;
}
[bg-color="dark 1000"] {
  background-color: @dark-1000;
}