/* UI Primary Colors */ $ui-blue: hsla(200, 90, 55, 1); // #25AFF4 $ui-orange: hsla(35, 90, 55, 1); // #F49D25 $ui-light-gray: hsla(0, 0, 98, 1); //#FAFAFA $ui-gray: hsla(0, 0, 95, 1); //#F2F2F2 $ui-dark-gray: hsla(0, 0, 70, 1); //#B3B3B3 $background-color: hsla(0, 0, 99, 1); //#FDFDFD /* UI Secondary Colors */ $ui-aqua: hsla(170, 70, 50, 1); //#26D9BB $ui-purple: hsla(265, 55, 55, 1); //#824DCB $ui-yellow: hsla(45, 100, 50, 1); //#FFBF00 $ui-white: #fff; $ui-border: hsla(0, 0, 85, 1); //#D9D9D9 /* 3.0 colors */ /* Using www naming convention for now, should be consistent with gui */ $ui-green: hsla(163, 83, 40, 1); // #0fbd8c Pen Primary $ui-coral: hsla(350, 100, 70, 1); // #FF6680 More Primary $ui-coral-dark: hsla(350, 100, 60, 1); // #FF3355 More tertiary $ui-blue-10percent: hsla(215, 100, 65, .1); $ui-blue-25percent: hsla(215, 100, 65, .25); $ui-orange-25percent: hsla(35, 90, 55, .25); /* Overlay UI Gray Colors */ $active-gray: hsla(0, 0, 0, .1); $active-dark-gray: hsla(0, 0, 0, .2); $box-shadow-gray: hsla(0, 0, 0, .25); $overlay-gray: hsla(0, 0, 0, .75); /* Typography Colors */ $header-gray: hsla(0, 0, 42, 1); //#6B6B6B $type-gray: hsla(0, 0, 42, 1); //#6B6B6B $type-white: #fff; $link-blue: $ui-blue; /* Component colors */ $splash-green: #9c0; $splash-pink: #c2479d; $splash-blue: #199ed7; /* Down Deep */ $dd-darkblue: hsla(195, 72.4, 17.1, 1);