Data Traffic Control Center

Style Guide First

관제 화면을 위한 다크 UI 베이스와 로그인 시작점

테스트용 화면 대신 실제 운영 관제에 어울리는 방향으로, 깊은 네이비 배경 위에 블루와 퍼플 포인트를 얹은 스타일 가이드를 먼저 정의했습니다. 이후 대시보드, 상태 패널, 알림 카드도 같은 언어로 이어갈 수 있습니다.

Visual Tokens

Core Palette

Partial Gradient

Background

#060816

Primary

#3B82F6

Accent

#8B5CF6

Signal

#22D3EE

Guide Notes

UI Direction

관제형 UI에 맞춘 다크 베이스와 블루/퍼플 포인트
패널, 보더, 글로우를 토큰화해서 이후 대시보드 확장 용이
로그인 이후 동일한 비주얼 시스템으로 모듈 페이지 연동 가능
내부 샘플 페이지 보기
DT

Secure Entry

Google Login Only

운영 관제용 로그인 화면

기능 연결 전 단계이므로, 현재는 Google 계정 기반 로그인 진입 화면만 우선 구성했습니다. 실제 인증 로직은 다음 요청에서 바로 붙일 수 있게 버튼과 안내 영역을 분리해 두었습니다.

Auth

Google SSO

Policy

Role Based

Surface

Ops Ready

현재 버튼은 UI 전용입니다. 인증 연동 시 조직 계정 제한, 세션 정책, 접근 권한 안내를 이어서 추가할 수 있습니다.

Next Step

로그인 기능 요청을 주시면 Google OAuth 연결 흐름과 보호 라우팅 구조까지 이어서 붙이겠습니다.