큐레이션 · 오픈 · 무료

Maryloufaure

Marylou Faure의 생동감 넘치고 장난기 있는 일러스트레이션을 위한 깔끔한 캔버스 역할을 하는 미니멀리스트 포트폴리오 사이트.

PortfolioPlayfulBold TypographyExpressiveGallery
Maryloufaure 스크린샷
↓ 디자인 시스템 다운로드 (51 MB)OpenDesign 에서 열기

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

📦 팩 내용 보기 →

01

디자인 DNA

아티스트일러스트레이션장난기 넘치는대담한즐거운

생동감 넘치는 캐릭터 기반 일러스트레이션을 선보이는 대담하고 장난기 넘치는 미술관.

02

컬러

#000000Ink
#FFFFFFBG
#868785Muted
rgba(0,0,0,0.2)Line

UI는 엄격하게 중립적(흑백)으로 구성되어, 아트워크의 대담한 색상이 시각적 계층을 지배할 수 있도록 합니다.

03

타이포그래피

grotesque-sans

일러스트레이션을 위한 미니멀한 배경을 유지하기 위해 깔끔한 sans-serif 타이포그래피를 사용합니다. · 큰 전시 제목에는 좁은 글자 간격(-0.5px)을 적용합니다. · 작은 내비게이션 및 캡션 레이블에는 넉넉한 글자 간격(0.5px)을 적용합니다.

04

여백

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

일정한 15px의 패딩은 콘텐츠 블록과 내비게이션 요소에 균일한 여백을 만듭니다.

05

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

sm · 0px
md · 8px
lg · 0px
pill · 50px

수평 구분선과 얇은 구조적 라인에 1px solid rgba(0,0,0,0.2)를 사용합니다.

rgba(0, 0, 0, 0.09) 0px 0px 14px 0px · rgba(0, 0, 0, 0.21) 0px 0px 4px 0px · rgba(0, 0, 0, 0.09) 0px 0px 0px 1px

06

레이아웃

1280container
12columns
24pxgutter
768 / 1024breakpoints

넓은 설명 텍스트 블록과 풀블리드 이미지 그리드가 번갈아 나타나는 전체 폭 단일 열 레이아웃입니다.

07

모션과 인터랙션

100msmicro
200mssmall
500msmedium
ease-outeasing

상태 간 부드러운 전환을 위한 opacity 페이드(0.4초~0.5초). · 링크 hover 인터랙션을 위한 text-decoration 토글. · 숨겨진 요소 표시를 위한 transform 및 opacity 전환.

링크에 text-decoration 밑줄이 나타납니다. · 모든 클릭 가능한 요소에 기본 포인터 커서입니다.

08

컴포넌트

09

보이스와 금지 목록

10

팩 안의 실제 스크린샷

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

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

11

System Prompt

이것은 생동감 넘치고 장난기 있는 일러스트레이션을 위한 깔끔하고 중립적인 캔버스 역할을 하는 미니멀리스트 아티스트 포트폴리오 사이트입니다. UI는 #000000 잉크(#FFFFFF 배경)와 무채색 레이블용 #868785로 구성된 엄격한 흑백 색상 체계에 의존합니다. 타이포그래피는 표준 grotesque sans-serif(Helvetica/Arial)를 일관된 400 웨이트로 사용하며, 큰 제목에는 좁은 트래킹(-0.5px), 작은 레이블에는 넓은 트래킹(0.5px)을 적용합니다. 중요하지 않은 사항에는: 장식용 폰트를 절대 사용하지 않음, 콘텐츠 카드에 UI 그림자나 둥근 모서리를 절대 추가하지 않음, 주요 UI 강조색을 절대 도입하지 않음이 포함됩니다. 레이아웃은 1px 얇은 선으로 구분된 풀블리드 이미지가 있는 단순하고 선형적인 단일 열 흐름입니다.

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

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

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

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