@daikin-oss/dds-tokens/build/css/aaf/Light/variables.css

Design token definitions for DDS

/**
 * Do not edit directly, this file was auto-generated.
 */

:root {
  --dds-color-blue-10: #ddf3fc;
  --dds-color-blue-20: #bbe7f9;
  --dds-color-blue-30: #98dbf7;
  --dds-color-blue-40: #76cff4;
  --dds-color-blue-50: #54c3f1;
  --dds-color-blue-60: #30ade9;
  --dds-color-blue-70: #0097e0;
  --dds-color-blue-80: #0081c0;
  --dds-color-blue-90: #00689a;
  --dds-color-blue-100: #005077;
  --dds-color-blue-110: #004160;
  --dds-color-blue-120: #002b40;
  --dds-color-green-10: #ccfef8;
  --dds-color-green-20: #9bfaef;
  --dds-color-green-30: #6cf5e4;
  --dds-color-green-40: #3bf1dc;
  --dds-color-green-50: #13e5cc;
  --dds-color-green-60: #00c3ac;
  --dds-color-green-70: #008f7e;
  --dds-color-green-80: #007b6c;
  --dds-color-green-90: #00665a;
  --dds-color-green-100: #005248;
  --dds-color-green-110: #003d36;
  --dds-color-green-120: #002924;
  --dds-color-yellow-10: #fff4d7;
  --dds-color-yellow-20: #ffeaaf;
  --dds-color-yellow-30: #ffd45f;
  --dds-color-yellow-40: #ffc936;
  --dds-color-yellow-50: #ffbf0e;
  --dds-color-yellow-60: #efb000;
  --dds-color-yellow-70: #b88700;
  --dds-color-yellow-80: #9e7400;
  --dds-color-yellow-90: #836000;
  --dds-color-yellow-100: #694d00;
  --dds-color-yellow-110: #4f3a00;
  --dds-color-yellow-120: #352700;
  --dds-color-orange-10: #feead9;
  --dds-color-orange-20: #fcd4b3;
  --dds-color-orange-30: #fbbf8e;
  --dds-color-orange-40: #ff9c4b;
  --dds-color-orange-50: #fd8b2e;
  --dds-color-orange-60: #fa7a12;
  --dds-color-orange-70: #e46b08;
  --dds-color-orange-80: #b45100;
  --dds-color-orange-90: #964400;
  --dds-color-orange-100: #783600;
  --dds-color-orange-110: #5a2900;
  --dds-color-orange-120: #3c1b00;
  --dds-color-red-10: #fdd9db;
  --dds-color-red-20: #fbb3b7;
  --dds-color-red-30: #f98d93;
  --dds-color-red-40: #f7666f;
  --dds-color-red-50: #f4404b;
  --dds-color-red-60: #f21a27;
  --dds-color-red-70: #d80c18;
  --dds-color-red-80: #b90a15;
  --dds-color-red-90: #9a0911;
  --dds-color-red-100: #7b070e;
  --dds-color-red-110: #5d050a;
  --dds-color-red-120: #3e0307;
  --dds-color-gray-10: #f2f2f2;
  --dds-color-gray-20: #ebebeb;
  --dds-color-gray-30: #dcdcdc;
  --dds-color-gray-40: #cecece;
  --dds-color-gray-50: #bfbfbf;
  --dds-color-gray-60: #a0a0a0;
  --dds-color-gray-70: #828282;
  --dds-color-gray-80: #616161;
  --dds-color-gray-90: #515151;
  --dds-color-gray-100: #414141;
  --dds-color-gray-110: #313131;
  --dds-color-gray-120: #212121;
  --dds-color-black: #000000;
  --dds-color-white: #ffffff;
  --dds-color-blue-gray-10: #eef0f2;
  --dds-color-blue-gray-20: #d8dde0;
  --dds-color-blue-gray-30: #bbc1c7;
  --dds-color-blue-gray-40: #a4acb4;
  --dds-color-blue-gray-50: #8d98a1;
  --dds-color-blue-gray-60: #76838e;
  --dds-color-blue-gray-70: #636e78;
  --dds-color-blue-gray-80: #505961;
  --dds-color-blue-gray-90: #444b52;
  --dds-color-blue-gray-100: #30353a;
  --dds-color-blue-gray-110: #282c30;
  --dds-color-blue-gray-120: #1b1e21;
  --dds-color-dark-gray-105: #383838;
  --dds-color-dark-gray-115: #282828;
  --dds-color-dark-gray-125: #1a1a1a;
  --dds-color-purple-10: #f0ddf3;
  --dds-color-purple-20: #e1bbe8;
  --dds-color-purple-30: #d399dc;
  --dds-color-purple-40: #c477d0;
  --dds-color-purple-50: #b556c5;
  --dds-color-purple-60: #a03db0;
  --dds-color-purple-70: #81318e;
  --dds-color-purple-80: #6f2a7a;
  --dds-color-purple-90: #5c2365;
  --dds-color-purple-100: #4a1c51;
  --dds-color-purple-110: #37153d;
  --dds-color-purple-120: #250e29;
  --dds-border-radius-100: 4px;
  --dds-border-radius-200: 8px;
  --dds-border-radius-050: 2px;
  --dds-border-width-100: 4px;
  --dds-border-width-025: 1px;
  --dds-border-width-050: 2px;
  --dds-space-100: 4px;
  --dds-space-200: 8px;
  --dds-space-300: 12px;
  --dds-space-400: 16px;
  --dds-space-600: 24px;
  --dds-space-800: 32px;
  --dds-space-1200: 48px;
  --dds-space-1600: 64px;
  --dds-space-050: 2px;
  --dds-font-regular-normal-300: 400 12px/1.5 Roboto;
  --dds-font-regular-normal-350: 400 14px/1.5 Roboto;
  --dds-font-regular-normal-400: 400 16px/1.5 Roboto;
  --dds-font-regular-normal-500: 400 20px/1.5 Roboto;
  --dds-font-regular-tight-300: 400 12px/1.3 Roboto;
  --dds-font-regular-tight-350: 400 14px/1.3 Roboto;
  --dds-font-regular-tight-400: 400 16px/1.3 Roboto;
  --dds-font-regular-tight-500: 400 20px/1.3 Roboto;
  --dds-font-size-300: 12px;
  --dds-font-size-350: 14px;
  --dds-font-size-400: 16px;
  --dds-font-size-500: 20px;
  --dds-font-size-600: 24px;
  --dds-font-size-700: 28px;
  --dds-font-size-800: 32px;
  --dds-font-line-height-tight: 1.3;
  --dds-font-line-height-normal: 1.5;
  --dds-font-weight-bold: 700;
  --dds-font-weight-regular: 400;
  --dds-font-family-base: Roboto;
  --dds-font-bold-normal-300: 700 12px/1.5 Roboto;
  --dds-font-bold-normal-350: 700 14px/1.5 Roboto;
  --dds-font-bold-normal-400: 700 16px/1.5 Roboto;
  --dds-font-bold-normal-500: 700 20px/1.5 Roboto;
  --dds-font-bold-tight-300: 700 12px/1.3 Roboto;
  --dds-font-bold-tight-350: 700 14px/1.3 Roboto;
  --dds-font-bold-tight-400: 700 16px/1.3 Roboto;
  --dds-font-bold-tight-500: 700 20px/1.3 Roboto;
  --dds-font-bold-tight-600: 700 24px/1.3 Roboto;
  --dds-font-bold-tight-700: 700 28px/1.3 Roboto;
  --dds-font-bold-tight-800: 700 32px/1.3 Roboto;
}