Material Design 색상 팔레트
Material Design 팔레트는 Google의 원리를 따릅니다. 주조색 하나와 강조용 보조색 하나, 중성적인 표면색, 텍스트와 높이 표현을 위한 회색 단계로 구성됩니다.
팔레트 예시
주조색#1976D2
밝은 주조색#42A5F5
표면색#FAFAFA
보조색#FFA000
표면 위 콘텐츠 색#212121
바로 복사할 수 있는 HEX 코드
인터페이스를 위한 구성
Material Design은 색을 주조색, 보조색, 표면색, 표면 위 콘텐츠 색, 오류색 등 역할에 따라 정리합니다. 각 색의 용도가 명확하므로 팔레트를 디자인 토큰에 연결하기 쉽습니다.
명암비와 높이 표현
Material에서는 텍스트와 표면 사이에 최소 4.5:1의 명암비가 필요합니다. 그림자를 여러 겹 쌓기보다 표면을 점차 밝게 하여 높이를 표현합니다. 그림자가 잘 보이지 않는 어두운 테마에서 특히 유용합니다.
나만의 material design 팔레트 생성
가입 없이 무료