Chattigo Palettes map

$chattigo-palette [private]

scss
$chattigo-palette: (
  primary: (
    dark      : hsl(347, 77%, 46%),
    base      : hsl(347, 84%, 56%),
    light     : hsl(344, 85%, 68%),
    light-alt : hsl(336, 38%, 72%),
  ),

  secondary: (
    dark      : hsl(25, 88%, 44%),
    base      : hsl(25, 88%, 55%),
    light     : hsl(25, 88%, 64%),
    light-alt : hsl(25, 87%, 82%),
  ),

  'grey': (
    dark      : hsl(0, 0%, 15%),
    base      : hsl(240, 1%, 26%),
    light     : hsl(300, 1%, 58%),
    light-i   : hsl(0, 0%, 88%),
    light-ii  : hsl(0, 0%, 95%),
    light-iii : hsl(210, 12%, 97%),
    light-alt : hsl(240, 9%, 75%),
  ),

  event: (
    success : hsl(142, 70%, 49%),
    error   : hsl(1, 99%, 43%),
    warning : hsl(44, 100%, 58%),
    info    : hsl(216, 98%, 61%),
    paused  : hsl(249, 56%, 45%),
  ),

  base: (
    true-white: hsl(0, 0%, 100%),
    'white'   : hsl(0, 0%, 98%),
    'black'   : hsl(240, 1%, 26%),
  ),

  gradients: (
    primary-hard: linear-gradient(-45deg, hsl(359, 83%, 53%) 0%, hsl(328, 82%, 54%) 100%),
    primary-soft: linear-gradient(90deg, hsl(339, 100%, 95%) 0%, hsl(0, 0%, 100%) 100%),
    balanced    : linear-gradient(138deg, hsl(347, 84%, 56%) 0%, hsl(35, 95%, 62%) 100%),
    balanced-dos: linear-gradient(241deg, hsl(347, 84%, 56%) 0%, hsl(22, 99%, 72%) 100%),
    night-mode  : linear-gradient(-18deg, hsl(249, 92%, 30%) 0%, hsl(249, 50%, 55%) 100%),
    select-grey : linear-gradient(90deg, hsl(0, 0%, 92%) 0%, hsl(0, 0%, 100%) 100%),
    info-soft : linear-gradient(270deg, hsl(0, 0%, 100%) 0%, hsl(43, 100%, 88%) 100%),
    info-soft--vertical : linear-gradient(0deg, hsl(0, 0%, 100%) 0%, hsl(43, 100%, 88%) 100%),
    grey-soft : linear-gradient(270deg, hsl(0, 0%, 100%) 0%, hsl(0, 0%, 91%) 100%),
    grey-soft--vertical : linear-gradient(0deg, hsl(0, 0%, 100%) 0%, hsl(0, 0%, 91%) 100%),
  ),

  social: (
    facebook  : hsl(215, 48%, 49%),
    whatsapp  : hsl(142, 70%, 49%),
    messenger : hsl(198, 100%, 50%),
    twitter   : hsl(203, 89%, 53%),
  ),

  messages: (
    sended  : hsl(46, 90%, 92%),
    received: hsl(0, 0, 99%),
  )
);

Used By

@function use-color()

$box-shadow-button [private]