WICKEDTeamWicked 토큰
TeamWicked 자체 웹사이트의 브랜드·색상·글꼴·CTA를 정의합니다. WickedHost 제품 토큰과 분리합니다.
적용 범위: TeamWicked 자체 브랜드·웹사이트. 호스팅 제품의 외형은 포함하지 않습니다. 공통 동작 규칙을 재사용하며, 다른 체계의 사례는 비교 근거일 뿐 스타일 상속이 아닙니다.
#f4f5ef#0a0a0a#eceee6#a8d946적용 범위
TeamWicked 자체 브랜드와 teamwicked.me 웹사이트에 적용합니다. vPanel(WICKEDVPS), Pterodactyl, store.teamwicked.me(Blesta)는 WickedHost 디자인 시스템에 속하며 이 문서의 외형을 자동 상속하지 않습니다.
현재 브랜드 기준
2026-09-12 확인한 메인 웹사이트의 소스·공개 화면 기준입니다. 문서 뷰어는 같은 자산을 사용하지만 기술문서 가독성을 위해 배경 dither 애니메이션은 생략합니다.
| 역할 | TeamWicked 기준 |
|---|---|
| 배경 | 라이트 #f4f5ef / 다크 #0a0a0a |
| 보조 표면 | 문서 라이트 #eceee6 / 다크 #171717 |
| 강조 | #a8d946 |
| 서체 | Geist + Pretendard |
| 브랜드 자산 | 기존 WICKED.svg; IBM 또는 다른 제품 로고로 대체하지 않음 |
| 주요 CTA | 검정/흰색 본체 + 라임 화살표 꼬리; 메인 WickedCta 구조 |
문서의 보조 표면은 열람 UI 값이며 모든 메인 컴포넌트의 토큰을 전수 추출했다는 의미가 아닙니다. 실제 원본 연결 범위는 버튼 페이지의 구현 코드와 출처를 확인합니다.
컴포넌트 사용
- 버튼: TeamWicked CTA의 실제 형태와 상태를 확인합니다.
- 색상, 타이포그래피, 레이아웃: 공통 행동·가독성 규칙을 자체 브랜드 값으로 적용합니다.
- 접근성: 키보드·레이블·오류 안내 규칙은 WickedHost와 재사용할 수 있지만 외형까지 동일하다는 의미는 아닙니다.
소유권과 변경
TeamWicked 브랜드 변경은 TeamWicked 문서·예제에 한정합니다. WickedHost의 제품 토큰이나 결제·서버 관리 UI를 같은 변경으로 덮어쓰지 않습니다. 공통 규칙 수정은 두 체계의 영향을 각각 검토합니다.
실제 구현 근거
메인 저장소 src/app/globals.css, src/app/layout.tsx, src/components/test/wicked-cta.tsx, src/components/site-header.tsx를 기준으로 확인했습니다. 실행형 예제는 API 미연결이며 모든 운영 사용처의 합격을 뜻하지 않습니다.