큐레이션 · 오픈 · 무료

Diagram

인터페이스 디자인을 가장 기본적인 구조적 구성 요소로 환원하는 초미니멀, 추상적 비주얼 시스템입니다.

AIToolingGradient
Diagram 스크린샷
OpenDesign 에서 열기

원본 사이트: https://diagram.com

01

디자인 DNA

미니멀리즘실험적추상적공허구조적

렌더링되지 않은 기본 도형의 갤러리 또는 소프트웨어의 개념적 '내부 구조' 뷰입니다.

02

컬러

#000000Ink
#FFFFFFBG
rgba(0,0,0,1.0)Line

구조와 본질을 전달하기 위해 순수한 검정과 순수한 흰색만을 사용하는 절대적 고대비 미니멀리즘입니다.

03

타이포그래피

transitional-serif

모든 텍스트 역할에 동일한 전이형 세리프 폰트를 사용합니다. · 표준 400 웨이트의 일관된 16px 기본 크기를 유지합니다. · 모든 요소에 전이 효과를 적용하여 미세한 상태 변화를 표현합니다.

04

여백

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

시각적으로 정의되지 않으며, 절대 위치 지정 또는 간격 기본 요소에 의존합니다.

05

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

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

구조적 경계에 1px solid rgb(0, 0, 0)을 적용합니다.

07

모션과 인터랙션

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

전역 'all' 전이를 통해 모든 요소에 부드러운 상태 전환을 적용합니다.

전역 전이 속성을 통해 촉발되는 미세한 상태 변화입니다. · 기본 요소에 대한 표준 포인터 상호작용입니다.

08

컴포넌트

09

보이스와 금지 목록

11

System Prompt

다이어그램은 디지털 인터페이스를 본질적인 흑백 구조 기본 요소로 단순화하는 미니멀하고 실험적인 디자인 시스템입니다. 비주얼 언어는 극명한 단색 팔레트(잉크 #000000, 배경 #FFFFFF)와 표준 16px 크기의 단일 전이형 세리프 서체의 일관된 사용으로 정의됩니다. 상호작용은 모든 속성에 적용되는 미세하고 보편적인 전이를 통해 처리됩니다. 레이아웃은 벗겨진 UI 컴포넌트의 추상적인 갤러리 같은 느낌을 줍니다. 핵심 제약 조건: 절대로 고채도 액센트 컬러를 도입하지 마세요. 여러 폰트 카테고리나 장식적 타이포그래피를 사용하지 마세요. 그림자, 깊이, 또는 둥근 모서리를 어떤 요소에도 추가하지 마세요.

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

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

OpenDesign 스킬 ↗

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