큐레이션 · 오픈 · 무료

Morgen

캘린더와 작업을 하나의 통합된 뷰로 결합하는 AI 기반 일일 플래너입니다.

productivitysaas
Morgen 스크린샷
↓ 디자인 시스템 다운로드 (14 MB)OpenDesign 에서 열기

원본 사이트: https://www.morgen.so

📦 팩 내용 보기 →

01

디자인 DNA

AI 기반 플래너일일 일정 관리캘린더 통합작업 관리

하루를 지능적으로 정리하는 스마트 디지털 어시스턴트

02

컬러

#F3C26AAccent
#FFFFFFInk
#CBCCCCInk soft
#191A23BG
#1E202BBG soft
#2A2E3CBG quiet
#686A74Muted
rgba(203, 204, 204, 0.2)Line

높은 대비의 흰색 텍스트를 가진 깊은 다크 배경을 사용하며, 주요 작업을 위해 따뜻한 골든 옐로우를 활용합니다.

03

타이포그래피

humanist-sans · monospace

04

여백

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

일관된 4px 기준선 그리드와 수직 간격 배수를 사용합니다.

05

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

sm · 4px
md · 8px
lg · 12px
pill · 220px

다크 배경에서 구분을 위한 미묘한 1px 테두리입니다.

0px 0px 20px 5px rgba(0, 0, 0, 0.15) · 0px 2px 32px 0px rgba(0, 0, 0, 0.16)

06

레이아웃

1200container
12columns
24pxgutter
768 / 1024breakpoints

히어로 분할 및 교차 기능 섹션을 사용하는 표준 중앙 정렬 콘텐츠 레이아웃입니다.

07

모션과 인터랙션

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

UI 요소를 위한 매끄러운 페이드 인 · 버튼과 링크의 호버 상태 전환

인터랙티브 요소에서 미묘한 색상 변화 또는 밝기 변화를 나타냅니다. · 스케일 또는 색상 변화를 통한 즉각적인 피드백을 나타냅니다.

08

컴포넌트

09

보이스와 금지 목록

10

팩 안의 실제 스크린샷

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

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

11

System Prompt

Morgen은 캘린더와 작업을 하나의 지능형 뷰로 통합하는 AI 기반 일일 플래너입니다. 개인과 팀을 위한 프리미엄 생산성 도구로 포지셔닝됩니다. 디자인 DNA는 깊은 다크 모드 미학(#191A23), 높은 대비의 흰색 타이포그래피, 그리고 주요 작업을 위한 시그니처 따뜻한 골든 옐로우 액센트(#F3C26A)로 특징지어집니다. 타이포그래피는 깔끔하고 현대적이며, 가독성과 친근하면서도 전문적인 톤을 보장하기 위해 본문과 표시 모두에 humanist sans-serif 범주를 사용합니다. 중요한 디자인 원칙으로는 넉넉한 여백 유지, 둥근 모서리(알약 모양까지) 사용, 그리고 밝고 눈에 띄는 색상이나 무겁고 방해가 되는 그림자 피하기가 포함됩니다. 레이아웃은 중앙 정렬되어 구조화되어 있으며, 종종 정보를 명확하게 제시하기 위해 화면 분할 또는 스택 섹션을 사용합니다. 모션은 미세하고 기능적이며, 프리미엄 느낌을 위한 매끄러운 전환에 초점을 맞춥니다.

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

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

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

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