큐레이션 · 오픈 · 무료

Gt Planar

GT Planar 타이프페이스를 쇼케이스하기 위해 설계된 몰입감 있는 레트로-퓨처리스틱 조종석 경험.

TypographyDark ModeExperimentalBold TypographyPortfolio
Gt Planar 스크린샷
↓ 디자인 시스템 다운로드 (7 MB)OpenDesign 에서 열기

원본 사이트: https://gt-planar.com

📦 팩 내용 보기 →

01

디자인 DNA

레트로-퓨처리스틱우주 조종석타이포그래피 쇼케이스인터랙티브

강렬한 타이프페이스를 쇼케이스하기 위해 사용되는 레트로-퓨처리스틱 우주 조종석 인터페이스.

02

컬러

#00ff85Accent
#ffffffInk
#000000BG
#949494Muted
rgba(255, 255, 255, 1.0)Line

단일 강렬한 그린 악센트를 사용한 고대비 단색 기반으로, 강건하고 레트로-테크니컬한 미학을 생성합니다.

03

타이포그래피

geometric-sans · monospaced

모든 UI 레이블과 내비게이션 요소에 대문자 텍스트를 사용합니다. · 모든 큰 디스플레이 타입에 1.0의 타이트한 행간을 유지합니다. · 모든 수치 데이터 표시에 폰트의 Tabular 변형을 활용합니다. · 기본 폰트 웨이트를 300으로 설정하여 세련되고 기술적인 느낌을 줍니다.

04

여백

4px
8px
16px
24px
32px
48px
64px
96px

4px 그리드를 기반으로 하며, UI 패널에는 5px 및 10px와 같은 특수 패딩을 사용합니다.

05

표면 (라운드 / 그림자 / 경계선)

sm · 0px
md · 0px
lg · 0px
pill · 9999px

1px solid #ffffff

1px 0px 0px 0px #ffffff · 0px 1px 0px 0px #ffffff · 1px 1px 0px 0px #ffffff · 1px 0px 0px 0px inset #ffffff · 0px 1px 0px 0px inset #ffffff

06

레이아웃

1280container
24pxgutter
768 / 1024breakpoints

고정된 코너 패널과 중앙 포커스 영역을 가진 풀 뷰포트 조종석 프레임.

07

모션과 인터랙션

220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

상단 배너의 지속적인 스크롤링 텍스트. · hover 시 미세한 변환. · 메인 디스플레이 타입을 위한 폰트 변형 설정 애니메이션.

인터랙티브 요소에서 미세한 변환 이동과 색상 전환. · 패널과 텍스트의 포인터 커서로 암시됨.

08

컴포넌트

09

보이스와 금지 목록

10

팩 안의 실제 스크린샷

Gt Planar — 桌面首屏（hero）
桌面首屏（hero）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Gt Planar — 移动首屏
移动首屏

실제 페이지에서 캡처 · 실 computed styles

11

System Prompt

이 디자인은 GT Planar 타이프페이스를 쇼케이스하기 위해 만들어진 highly 스타일화된 레트로-퓨처리스틱 우주 조종석 인터페이스입니다. 순수한 검정(#000000), 흰색(#ffffff), 그리고 강렬한 기술 그린(#00ff85)으로 구성된 강건하고 고대비 팔레트를 특징으로 하며, 중요한 작업을 위한 단일 레드(#ff0000) 악센트를 포함합니다. 타이포그래피는 기하학적 산세리프 카테고리에만 의존하며, GT Planar 폰트 패밀리를 극단적인 디스플레이 크기와 작은 기술 스케일 모두에서 활용합니다. 중요한 주의사항은 다음과 같습니다: 둥근 모서리나 소프트 그림자를 사용하지 마세요, 인터페이스는 날카로운 1px 테두리로 정의됩니다; UI 요소에 대소문자가 혼합된 텍스트를 사용하지 마세요, 이는 엄격히 대문자입니다; 그리고 장식적이거나 친근한 미학을 피하세요, 전체적으로 순수하게 기술적이고 기계적인 느낌을 유지합니다.

이 감각을 당신의 에이전트에

이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.

OpenDesign 스킬 ↗ · 이 팩 (에이전트용) ↗

en · zh-CN · zh-TW · ja · ko