base colors css vars

_base_colors.css

:root{

//social colors
  --facebook    :#3b5998;
  --twitter     :#55acee;
  --youtube     :#bb0000;
  --linkedin    :#007bb5;
  --instagram-y :#FCCC63;
  --instagram-p :#8a3ab9;
  --whatsapp    :#4dc247;
  --pinterest   :#cb2027;
  --github      :#000000;
  
  //bootstrap colors 
  
   //dark
  --dark-10:    #d5d9dd;
  --dark-20:    #b9bfc6;
  --dark-30:    #9da6af;
  --dark-40:    #808c98;
  --dark-50:    #67737f;
  --dark-60:    #505962;
  --dark-70:    #394046;
  --dark-80:    #22262a;
  --dark:       #0b0d0e;
  //danger
  --danger-10:    #fbe9eb;
  --danger-20:    #f4bec3;
  --danger-30:    #ec929b;
  --danger-40:    #e56773;
  --danger:       #dd3b4b;
  --danger-60:    #c42231;
  --danger-70:    #981a26;
  --danger-80:    #6d131b;
  --danger-90:    #410b10;
  //success
  --success-10:    #eafaee;
  --success-20:    #c1f0cc;
  --success-30:    #98e6aa;
  --success-40:    #6fdd88;
  --success:       #28a745;
  --success-60:    #2cb94d;
  --success-70:    #22903c;
  --success-80:    #19672b;
  --success-90:    #0f3e1a;
  //info
  --info-10: #e8f9fc;
  --info-20: #bbeef6;
  --info-30: #8ee3f1;
  --info-40: #60d8eb;
  --info-50: #33cde5;
  --info-60: #33cde5;
  --info-70: #33cde5;
  --info-80: #33cde5;
  --info-90: #33cde5;
  --info:#17a2b8;
  //primary
  --primary-10: #e5f2ff;
  --primary-20: #b3d7ff;
  --primary-30: #80bdff;
  --primary-40: #4da3ff;
  --primary-50: #4da3ff;
  --primary-60: #006fe6;
  --primary:    #007bff;
  --primary-70: #006fe6;
  --primary-80: #003d80;
  --primary-90: #00254d;
  //warning
  --warning-10: #fff9e5;
  --warning-20: #ffecb3;
  --warning-30: #ffdf80;
  --warning-40: #ffd24d;
  --warning-50: #ffc61a;
  --warning:    #ffc107;
  --warning-60: #e6ac00;
  --warning-70: #b38600;
  --warning-80: #806000;
  --warning-90: #4d3900;
}