Chalk — 다크 사이드바와 파스텔 KPI 카드의 대시보드 스타일

Chalk는 짙은 칠판색 사이드바 위에 파스텔 분필색 KPI 카드를 올린 대시보드 스타일입니다. 아래 샘플은 가상 온라인몰의 최근 30일 주문 데이터로 만들었고, 채널 탭을 바꾸면 KPI와 두 차트가 함께 바뀝니다. HTML 파일 하나로 브라우저에서 바로 동작합니다.

Design

• 색은 카드 배경에만: 파스텔은 KPI 카드 배경에만 쓰고, 숫자와 차트는 그보다 짙은 색으로 두어 데이터가 먼저 읽히게 했습니다. 차트 색은 색각 이상이 있어도 구분되는지 검증한 조합입니다.
• 증감 색은 좋고 나쁨 기준: 화살표 색은 값이 움직인 방향이 아니라 그 변화가 좋은지로 정했습니다. 취소·반품률은 내려가야 좋은 지표라 하락을 초록으로 표시합니다.
• 평일과 주말을 한 축에: 시간대별 주문은 평일(실선)과 주말(점선)을 겹쳐 피크 시간의 차이를 보여 주고, 처음에는 주문이 가장 많은 시간대에 초점을 둡니다. 라이브커머스 탭을 고르면 방송 시간대에 주문이 몰리는 모습을 볼 수 있습니다.
• 구성비는 세 가지 색까지: 카테고리 비중은 게이지형 도넛으로 보여 주고, 색은 세 가지까지만 쓰며 나머지는 회색 '기타'로 묶습니다.

Prompt

Chalk의 레이아웃, 색, 글꼴, 카드와 차트 표현은 스타일 명세에 정리해 두었습니다. 명세 주소와 함께 요청하면 다른 데이터로도 같은 스타일의 대시보드를 만들 수 있습니다.

첨부한 데이터로 HTML 파일 하나짜리 대시보드를 만들어 줘.
스타일은 Chalk로 하고, 아래 명세의 레이아웃·색·글꼴·카드와 차트 표현을 그대로 따라 줘.
지표와 차트 구성은 데이터에 맞게 정해 줘.
https://styles.vizney.com/chalk/style.html

이 스타일로 대시보드 제작이 필요하면 문의를 남겨 주세요.