큐레이션 · 오픈 · 무료

Magdareyman

브랜딩과 사용자 인터페이스를 연결하는 세련된 디자인 포트폴리오입니다.

01

디자인 DNA

세련되고 자신감 있는 미니멀리즘으로 제시된 디자인 작업의 큐레이션된 갤러리입니다.

02

컬러

작업이 스스로 말하게 만드는 중성적인 회색과 깊은 블랙을 사용한 모노크롬 팔레트입니다.

03

타이포그래피

transitional-serif · humanist-sans · monospace

• display40px · 400
• body16px · 400
• caption8px · 400

기본 UI 및 본문 텍스트에는 시스템 산세리프 스택을 사용합니다. · 표시 텍스트와 강조에는 깔끔한 트랜지셔널 세리프를 사용합니다. · 표시 텍스트에는 타이트한 행간을 유지합니다.

04

여백

여유로운 여백이 여유롭고 편집적인 분위기를 만듭니다.

05

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

1.4px solid #282828

0 4px 20px rgba(0,0,0,0.1)

06

레이아웃

돋보이는 히어로 영역과 여기저기 배치된 프로젝트 쇼케이스를 갖춘 간단한 그리드 레이아웃입니다.

07

모션과 인터랙션

인터랙티브 요소를 위한 불투명도와 변형 트랜지션입니다.

미묘한 색상 변화 또는 불투명도 이동입니다. · 최소한의 피드백으로 즉각적인 응답입니다.

08

컴포넌트

• button 솔리드 배경이나 텍스트 전용의 알약 모양입니다.
• card 앱 UI 스크린샷의 깔끔한 프레젠테이션입니다.
• chip 연락처 정보를 위한 작은 대문자 텍스트 레이블입니다.
• input 전체적인 산세리프와 일관된 미니멀리스트 스타일링입니다.
• hero 부제목이 있는 큰 타이포그래피 스테이트먼트입니다.

09

보이스와 금지 목록

• 톤 자신감 있고 미니멀리스트적이며, 약간의 장난기 있지만 전문적입니다.
• 헤드라인 타이트한 간격의 크고 깔끔한 세리프 또는 산세리프입니다.
• CTA 텍스트 기반 링크 또는 간단한 알약 모양 버튼입니다.

• 밝고 채도 높은 색상을 사용하지 마세요 — 스크린샷은 엄격히 모노크롬, 그레이스케일 팔레트를 보여줍니다.
• 화려한 디스플레이 폰트를 사용하지 마세요 — 표시 텍스트는 깔끔하고 정제된 트랜지셔널 세리프를 사용합니다.
• 빽빽한 레이아웃을 만들지 마세요 — 스크린샷은 풍부한 여백과 여유롭고 개방적인 구조를 보여줍니다.
• 복잡한 그림자나 그라데이션을 사용하지 마세요 — 스크린샷은 최소한의 미묘한 그림자가 있는 플랫 표면을 보여줍니다.
• 날카로운 모서리의 둥근 사각형을 사용하지 마세요 — 스크린샷은 높은 border-radius를 가진 알약 모양 버튼과 요소를 보여줍니다.
• 무거운 글꼴 굵기를 사용하지 마세요 — 스크린샷은 주로 보통(400) 굵기의 타이포그래피를 보여줍니다.
• 피하기: 지나치게 장식적인 요소
• 피하기: 빽빽한 문단
• 피하기: 밝고 채도 높은 색상

10

팩 안의 실제 스크린샷

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

11

System Prompt

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