프로젝트: 12 디자인 시스템: 7종

디자인

프로젝트별 색상 팔레트

Modfolio Dashboard

Stellar v9

Modfolio Connect

Stellar v9

Naviaca

Custom UnoCSS

GistCore

Custom UnoCSS

Sincheong

Custom

Fortiscribe

Custom SvelteKit

KeepNBuild

Custom SvelteKit

Worthee

Custom SolidStart

Amberstella

Custom SolidStart

Munseo

Minimal

Umbracast

Custom

DLE-Desk

Swiss (light/dark)

다크

프로젝트별 폰트

Modfolio Dashboard

heading Source Serif 4

가나다라마바사 The quick brown fox 1234567890

body Wanted Sans Variable

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Modfolio Connect

heading Source Serif 4

가나다라마바사 The quick brown fox 1234567890

body Source Serif 4

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Naviaca

heading Space Grotesk

가나다라마바사 The quick brown fox 1234567890

body Inter

가나다라마바사 The quick brown fox 1234567890

serif Cormorant Garamond

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

GistCore

heading Noto Serif KR

가나다라마바사 The quick brown fox 1234567890

body Noto Sans KR

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Sincheong

heading Pretendard Variable

가나다라마바사 The quick brown fox 1234567890

body Pretendard Variable

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Fortiscribe

heading Source Serif 4

가나다라마바사 The quick brown fox 1234567890

body Inter

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

KeepNBuild

heading Space Grotesk

가나다라마바사 The quick brown fox 1234567890

body Inter

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Worthee

heading Wanted Sans Variable

가나다라마바사 The quick brown fox 1234567890

body Pretendard Variable

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Amberstella

heading Cormorant Garamond

가나다라마바사 The quick brown fox 1234567890

body Inter

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Munseo

heading Source Serif 4

가나다라마바사 The quick brown fox 1234567890

body Source Serif 4

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

Umbracast

heading Pretendard Variable

가나다라마바사 The quick brown fox 1234567890

body Pretendard Variable

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

DLE-Desk

heading Inter

가나다라마바사 The quick brown fox 1234567890

body Inter

가나다라마바사 The quick brown fox 1234567890

serif Newsreader

가나다라마바사 The quick brown fox 1234567890

mono JetBrains Mono

가나다라마바사 The quick brown fox 1234567890

색상 플레이그라운드

색상을 바꿔보며 조합을 실험하세요. CSS variable 코드가 자동 생성됩니다.

#FFD97A
#0A0A0F
#13131A
#EDE8F0
#8EC8E0

미리보기 제목

본문 텍스트 예시입니다. 가나다라마바사.

강조 텍스트

CSS Variables

폰트 플레이그라운드

폰트 조합을 실험하세요.

모드폴리오 유니버스 — Modfolio Universe

본문 텍스트 예시입니다. 가나다라마바사 아자차카타파하. The quick brown fox jumps over the lazy dog. 1234567890 !@#$%^&*() 

const hello = "세계 여러분 안녕하세요";