큐레이션 · 오픈 · 무료

Trigger.dev

AI 에이전트와 워크플로를 구축 및 배포하기 위한, 완전한 런타임 제어 기능을 갖춘 어두운 개발자 중심 플랫폼.

devtoolsdark
Trigger.dev 스크린샷
↓ 디자인 시스템 다운로드 (14 MB)OpenDesign 에서 열기

원본 사이트: https://trigger.dev

📦 팩 내용 보기 →

01

디자인 DNA

개발자AI자동화런타임TypeScript

AI 워크플로를 위한 산업용 멀티탭

02

컬러

#BFFF00Accent
#D7D9DDInk
#878C99Ink soft
#121317BG
#1C1E21BG soft
#15171ABG quiet
rgba(59, 62, 69, 1)Line

깊은 어두운 표면, 고대비 중립 텍스트, 그리고 주요 액션을 위한 단일의 네온 그린 강조색.

03

타이포그래피

geometric-sans · humanist-sans · monospace

큰 디스플레이 헤드라인에는 기하학적 산세리프를 사용합니다. · 인라인 코드 참조 및 터미널 UI 요소에는 고정폭 글꼴을 사용합니다.

04

여백

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

일관된 4px 그리드와 큰 컨테이너 요소를 위한 넉넉한 padding.

05

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

sm · 4px
md · 6px
lg · 12px
pill · 9999px

1px solid rgba(59, 62, 69, 1)

0 1px 2px 0 rgba(0, 0, 0, 0.05)

06

레이아웃

1280container
12columns
24pxgutter
768 / 1024breakpoints

눈에 띄는 전체 너비의 히어로 섹션과 그리드 기반의 기능 섹션을 따르는 표준 중앙 정렬 레이아웃.

07

모션과 인터랙션

150msmicro
200mssmall
300msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

인터랙티브 요소에서의 표준 색상 및 background-color 전환. · hover 상태를 위한 미세한 불투명도 및 변형 변경.

요소는 0.15초에서 0.3초의 지속 시간 동안 hover 시 미세하게 색상이나 background-color를 변경합니다. · 최소한의 피드백으로, 주로 상태 변화를 나타내기 위해 색상 전환에 의존합니다.

08

컴포넌트

09

보이스와 금지 목록

10

팩 안의 실제 스크린샷

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

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

11

System Prompt

이것은 어두운 산업 미학을 가진 개발자 중심 AI 플랫폼입니다. 디자인 DNA는 깊은 숯색 배경(#121317)과 고대비 중립 텍스트(#D7D9DD), 그리고 주요 CTA를 위한 단일의 고채도 네온 그린 강조색(#BFFF00)을 중심으로 합니다. 타이포그래피는 헤드라인과 본문 텍스트를 위한 기하학적 및 인본주의 산세리프의 깨끗한 조합과 기술적 참조를 위한 고정폭 글꼴을 사용합니다. 레이아웃은 중앙 정렬되고 넓으며, 일관된 4px 간격 그리드를 사용합니다. 중요하지 않은 사항: 라이트 모드 팔레트를 절대 사용하지 마세요, 장식 글꼴을 절대 사용하지 마세요, 제품의 기술적이고 집중적인 본질을 산만하게 하는 무거운 drop shadow나 다색 강조를 절대 사용하지 마세요. 시스템은 전체적으로 전문적이고 권위적이며 기술적인 어조를 유지해야 합니다.

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

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

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

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