본문 바로가기
전체메뉴 열기/닫기

UI/UX 가이드

System Color

Color Guide

Color table (white)

  • rgba(255, 255, 255, 1) var(--main-bg)
  • rgba(0, 0, 0, 1) var(--main-bg-text)
  • rgba(30, 30, 30, 1) var(--main-text)
  • rgba(255, 59, 48, 1) var(--red)
  • rgba(255, 149, 0, 1) var(--orange)
  • rgba(255, 204, 0, 1) var(--yellow)
  • rgba(40, 205, 65, 1) var(--green)
  • rgba(0, 199, 190, 1) var(--mint)
  • rgba(89, 173, 196, 1) var(--teal)
  • rgba(85, 190, 240, 1) var(--cyan)
  • rgba(0, 122, 255, 1) var(--blue)
  • rgba(88, 86, 214, 1) var(--indigo)
  • rgba(175, 82, 222, 1) var(--purple)
  • rgba(255, 45, 85, 1) var(--pink)
  • rgba(162, 132, 94, 1) var(--brown)
  • rgba(142, 142, 147, 1) var(--gray)
  • rgba(174, 174, 178, 1) var(--gray2)
  • rgba(199, 199, 204, 1) var(--gray3)
  • rgba(209, 209, 214, 1) var(--gray4)
  • rgba(229, 229, 234, 1) var(--gray5)
  • rgba(242, 242, 247, 1) var(--gray6)

Color table (dark)

  • rgba(0, 0, 0, 1) var(--main-bg)
  • rgba(255, 255, 255, 1) var(--main-bg-text)
  • rgba(220, 220, 220, 1) var(--main-text)
  • rgba(255, 69, 58, 1) var(--red)
  • rgba(255, 159, 10, 1) var(--orange)
  • rgba(255, 214, 10, 1) var(--yellow)
  • rgba(50, 215, 75, 1) var(--green)
  • rgba(102, 212, 207, 1) var(--mint)
  • rgba(106, 196, 220, 1) var(--teal)
  • rgba(90, 200, 245, 1) var(--cyan)
  • rgba(10, 132, 255, 1) var(--blue)
  • rgba(94, 92, 230, 1) var(--indigo)
  • rgba(191, 90, 242, 1) var(--purple)
  • rgba(255, 55, 95, 1) var(--pink)
  • rgba(172, 142, 104, 1) var(--brown)
  • rgba(152, 152, 157, 1) var(--gray)
  • rgba(99, 99, 102, 1) var(--gray2)
  • rgba(72, 72, 74, 1) var(--gray3)
  • rgba(58, 58, 60, 1) var(--gray4)
  • rgba(44, 44, 46, 1) var(--gray5)
  • rgba(28, 28, 30, 1) var(--gray6)