큐레이션 · 오픈 · 무료

Tomorrow Happens Studio

정적인 단어 'Tomorrow'로 중심을 잡고, 연속적이고 페이드되는 시적 스크롤을 사용하는 미니멀리스트 디자인 스튜디오 랜딩 페이지입니다.

StudioEditorialTypographyCalmRestraint

↓ 디자인 시스템 다운로드 (1 MB)OpenDesign 에서 열기

원본 사이트: https://tomorrow-happens.studio

📦 팩 내용 보기 →

디자인 DNA

미니멀시적디자인 스튜디오사색적

단어 하나로 중심을 잡은 고요한 시집

컬러

#000000Ink

#ffffffBG

#e3e3e3Muted

rgba(0,0,0,1.0)Line

시각적 계층 구조를 위해 각기 다른 불투명도를 사용한 까다로운 단색 팔레트의 고대비 미니멀리즘.

타이포그래피

transitional-serif

display39px · 200
body12px · 500

여백

4px

8px

16px

24px

32px

48px

60px

96px

메인 디스플레이 텍스트에는 넉넉한 여백과 타이트한 행간을 적용합니다.

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

sm · 0px

md · 0px

lg · 0px

pill · 0px

미세하고 정확한 내비게이션 구분선을 위한 1px solid black.

레이아웃

1280container

12columns

24pxgutter

768 / 1024breakpoints

사이드바 내비게이션과 수직 스크롤 텍스트 블록에 집중된 주요 콘텐츠.

모션과 인터랙션

150msmicro

500mssmall

0msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

개별 라인의 불투명도 페이드를 포함한 연속 수직 스크롤

내비게이션 항목의 불투명도 페이드. · 사이드바 및 푸터 내비게이션 링크에서 트리거.

컴포넌트

button '+' 접미사가 있는 텍스트 전용 내비게이션 링크.
hero 고정된 정적 앵커 단어가 있는 전체 화면의 연속 텍스트 스크롤.

보이스와 금지 목록

톤 시적, 사색적, 철학적
헤드라인 소문자, 문장 대소문자, 연속적으로 스크롤되는 단편적인 문장들
CTA '+' 접미사가 있는 미니멀리스트 텍스트 링크

밝은 강조 색상을 사용하지 마세요 — 스크린샷은 까다로운 흑백 단색 팔레트를 보여줍니다.
디스플레이 텍스트에 무거운 폰트 웨이트를 사용하지 마세요 — 스크린샷은 매우 얇고 우아한 세리프 폰트를 보여줍니다.
드롭 섀도우나 복잡한 3D 효과를 사용하지 마세요 — 스크린샷은 완전히 평면적이고 2차원적인 요소들을 보여줍니다.
버튼이나 카드에 둥근 모서리를 사용하지 마세요 — 스크린샷은 날카롭고 기하학적이며 테두리가 없는 레이아웃을 보여줍니다.
화려한 배경 패턴이나 이미지를 사용하지 마세요 — 스크린샷은 깨끗하고 순백의 배경을 보여줍니다.
복잡하고 다단계 내비게이션 메뉴를 사용하지 마세요 — 스크린샷은 단순하고 평면적인 텍스트 링크만 보여줍니다.
피하기: 대문자 헤더
피하기: 밝은 강조 색상
피하기: 빽빽한 문단

팩 안의 실제 스크린샷

Tomorrow Happens Studio — 桌面首屏（hero） — 桌面首屏（hero）

Tomorrow Happens Studio — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

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

System Prompt

이것은 미니멀리스트 디자인 스튜디오 포트폴리오입니다. 주요 시각적 아이덴티티는 순백(#ffffff)과 순수한 흑(#000000)의 강렬한 단색 팔레트 위에 구축되었습니다. 시적이고 연속적으로 스크롤되는 디스플레이 텍스트를 위해 얇고 트랜지셔널 세리프 폰트에 크게 의존하며, 이는 내비게이션용 작은 고딕산세리프와 대조됩니다. 핵심 인터랙션은 텍스트에 페이드 효과를 만드는 수직 스크롤입니다. 중요한 주의 사항은 다음과 같습니다: 밝은 강조 색상을 절대 사용하지 말 것, 디스플레이 텍스트에 무거운 폰트 웨이트를 절대 사용하지 말 것, 요소에 드롭 섀도우, 복잡한 테두리 또는 둥근 모서리를 절대 추가하지 말 것. 디자인은 철저히 평면적이고 공기 같으며 타이포그래피에 집중되어야 합니다.

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

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

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

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