# Wanted Design System (Montage) — 디자인 스타일 가이드

## 기본 정보
- **ID**: wanted-montage
- **카테고리**: design-language
- **연도**: 2024
- **제작자**: Wanted Lab (원티드랩)

## 설명
CC BY 4.0 오픈소스 디자인 시스템으로, 명도 기반 넘버링 컬러 체계(0=Black, 100=White), Pretendard JP 타이포그래피, 5단계 Normal/Spread 엘리베이션, 7개 카테고리 40+개 컴포넌트를 갖춘 원티드의 크로스 플랫폼 디자인 시스템입니다.

## 역사·배경
원티드랩이 2024년 디자인 라이브러리로 처음 선보인 뒤, 2025년 에이전틱 디자인 시스템 'Montage'로 확장하여 CC BY 4.0 오픈소스로 공개했습니다. 'From Separate Core Blocks To a Seamless Flow'를 슬로건으로, AI가 디자인을 읽고 생성할 수 있도록 설계된 것이 특징입니다.

## 핵심 원칙
- Modularity — 독립적 재사용 가능한 컴포넌트 단위
- Seamlessness — iOS, Android, Web 모두 하나의 시스템
- Openness — CC BY 4.0으로 누구나 자유롭게 활용

## 주요 특징
- 명도 기반 컬러 넘버링 (0=Black, 100=White)
- Normal/Spread 듀얼 엘리베이션 시스템
- Pretendard JP 기반 19단계 타이포 스케일
- 4px 기반 스페이싱 + 8px 그리드
- CC BY 4.0 오픈소스 라이선스

## 컬러 시스템 가이드
명도 기반 넘버링(0=Black, 100=White)의 시맨틱 컬러 토큰 시스템으로, Primary Blue를 5단위로 세분화하고 Opacity 프레임으로 상호작용 상태를 표현

### 색상 역할
- primary: Blue 계열 — Normal/Strong/Heavy 3단계로 중요도 표현
- label: Normal~Disable 6단계로 텍스트 위계 표현
- fill: Normal/Strong/Alternative 3단계 투명도 포함 배경
- line: Normal/Neutral/Alternative — Solid 변형으로 중첩 방지
- background: Normal/Alternative + Elevated(모달용) + Transparent(Chrome 효과)
- status: Positive(Green), Cautionary(Yellow), Negative(Red)
- accent: Red~Pink 11색 Foreground/Background 쌍 제공

### 색상 제약 조건
- Cool Neutral 팔레트 21단계 — 무채색에도 미세한 쿨톤 적용
- Line 컬러는 투명값 포함이므로 중첩 사용 금지 — 중첩 시 Line-Solid 사용
- Hover/Active 상태는 색상 변경 대신 Opacity 프레임으로 처리
- Static White/Black은 테마와 무관하게 고정 — Inverse 패턴과 구분하여 사용

### 다크모드 전략
Background-Elevated에서 Normal과 색상 차이를 두어 층위 구분, Static 컬러는 테마 변경에도 고정 유지

### 대비 요구사항
시맨틱 토큰 레벨에서 역할별 대비 자동 보장 — Label Normal은 배경 대비 최고, Assistive/Disable은 의도적으로 약한 대비

## 타이포그래피 가이드
- **폰트 성격**: Pretendard JP — 한국어/영어/일본어를 단일 폰트로 지원하는 현대적 산세리프
- **권장 폰트 수**: 최대 1개
- **타입 스케일**: 1.143 (Minor Second에 가까운 세밀한 스케일)

### 타이포그래피 제약
- Display(56~36px) → Title(32~24px) → Heading(22~20px) → Headline(18~17px) → Body(16~15px) → Label(14~13px) → Caption(12~11px) 19단계 스케일
- Body/Label은 Normal(일반)과 Reading(긴 텍스트) 두 가지 행간 제공
- 큰 텍스트일수록 음수 자간(-0.032em), 작은 텍스트일수록 양수 자간(+0.031em)
- 음절 단위 줄바꿈(word-break) — 디자인 시 별도 줄바꿈 불필요

## 하면 안 되는 것 (안티패턴)
- 시맨틱 토큰을 무시하고 Atomic 컬러 직접 사용 금지
- Line 컬러(투명값)를 중첩하여 사용 금지 — Line-Solid로 대체
- 4px 기반 스페이싱 규칙을 벗어나는 임의 간격 사용 금지
- Elevation 레벨을 건너뛰어 깊이 관계 모호하게 만들기 금지

## 반드시 포함해야 하는 것
- 4px 기반 스페이싱 (시각보정 시 2px, 불가피 시 1px까지 허용)
- 8px 그리드 + 20px 거터의 반응형 컬럼 시스템 (Mobile 2단, Tablet 3단, Desktop 12단)
- Normal/Spread 듀얼 엘리베이션 (Ambient + Key shadow 레이어링)
- 7개 카테고리 컴포넌트 활용 (Actions, Contents, Feedback, Loading, Navigations, Presentation, Selection & Input)
- 시맨틱 컬러 토큰을 통한 일관된 색상 사용

## 모션 가이드
ease 200ms 기본 — 사용자 플로우를 방해하지 않는 간결하고 빠른 트랜지션

## 사용 사례
- 채용 / HR 플랫폼
- B2B SaaS 대시보드
- 크로스 플랫폼 앱 (iOS + Android + Web)
- 데이터 중심 콘텐츠 플랫폼
- 오픈소스 기반 자체 디자인 시스템 구축

## 추천 프로젝트 유형
- 오픈소스 디자인 시스템을 기반으로 자사 시스템 구축
- 한·영·일 다국어 지원이 필요한 서비스
- 정보 밀도가 높은 데이터 중심 웹/앱
- Figma 기반 디자인-개발 협업 워크플로

## 장점
- CC BY 4.0 오픈소스 — 상업적 사용, 수정, 재배포 자유
- 명도 기반 숫자 네이밍으로 직관적 색상 선택 가능
- Pretendard JP로 한국어/영어/일본어 동시 지원
- Figma UI Kit 공개 (Web + Native 별도 제공)
- Hover/Active 상태를 Opacity 프레임으로 처리하여 색상 관리 단순화

## 단점·한계
- 2024년 공개된 비교적 새로운 시스템으로 커뮤니티 생태계가 작음
- Wanted Sans 커스텀 폰트는 별도 적용 필요
- 채용 도메인 최적화로 타 도메인에 그대로 적용 시 일부 컴포넌트 부족 가능

## 실제 사용 제품·서비스
- 원티드 (채용 플랫폼)
- 원티드긱스 (프리랜서 매칭)
- 원티드인사이트 (HR 솔루션)
- 원티드스페이스 (커리어 콘텐츠)

## 접근성
시맨틱 컬러 토큰으로 Label(Normal~Disable), Status(Positive/Cautionary/Negative), Interaction(Inactive/Disable) 등 상태별 색상을 체계적으로 정의하며, Static White/Black으로 테마 변경에도 고정 대비를 보장합니다.

## 관련 스타일
- [toss-design-system](https://ui.buildersgate.com/styles/toss-design-system)
- [atlassian-design](https://ui.buildersgate.com/styles/atlassian-design)
- [carbon-design](https://ui.buildersgate.com/styles/carbon-design)
- [ant-design](https://ui.buildersgate.com/styles/ant-design)

## 참고 구현 예시 (디자인 토큰)
> 아래 토큰은 이 스타일의 참고 구현 예시입니다. 프로젝트의 브랜드 컬러·폰트에 맞게 조정하되, 위 컬러 시스템/타이포그래피 가이드의 제약 조건을 준수하세요.

### 색상
- primary: #3366FF
- secondary: #F8F8F8
- accent: #3366FF
- background: #FFFFFF
- surface: #FFFFFF
- text: #171719
- textSecondary: #878A93
- border: #E1E2E4

### 헤더
- background: #FFFFFF
- textColor: #171719
- accentColor: #3366FF

### 타이포그래피
- fontFamily: Inter, 'Noto Sans KR', sans-serif
- headingWeight: 700
- bodyWeight: 400
- letterSpacing: 0em

### 스페이싱
- unit: 4px
- scale: 1

### 그림자 (Shadows)
- sm: 0 1px 2px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.10)
- md: 0 2px 4px rgba(0,0,0,0.06), 0 4px 8px rgba(0,0,0,0.10)
- lg: 0 4px 8px rgba(0,0,0,0.06), 0 8px 16px rgba(0,0,0,0.10)
- xl: 0 8px 16px rgba(0,0,0,0.06), 0 16px 32px rgba(0,0,0,0.10)

### Border Radius
- none: 0
- sm: 4px
- md: 8px
- lg: 12px
- full: 9999px

### 테두리 (Borders)
- width: 1px
- style: solid
- color: #E1E2E4

### 이펙트
- blur: 0px
- opacity: 1
- transition: all 0.2s ease

### 애니메이션
- duration: 200ms
- easing: ease

### 컴포넌트 토큰
- 버튼: shape=rounded / hoverEffect=darken / textTransform=none
- 카드: style=outlined / hoverEffect=lift
- 인풋: style=outlined / focusEffect=border
- 배지: shape=rounded / style=solid
- 아이콘: package=lucide / strokeWidth=1.5 / defaultSize=24

### 레이아웃
- containerStyle: boxed
- sectionSpacing: normal

### 특수 효과
- glassmorphism: false
- gradientText: false
- animatedBackground: false
- scanlines: false
- noise: false

## 자주 묻는 질문 (FAQ)

### Q: Wanted Design System (Montage)이란 무엇인가요?
A: CC BY 4.0 오픈소스 디자인 시스템으로, 명도 기반 넘버링 컬러 체계(0=Black, 100=White), Pretendard JP 타이포그래피, 5단계 Normal/Spread 엘리베이션, 7개 카테고리 40+개 컴포넌트를 갖춘 원티드의 크로스 플랫폼 디자인 시스템입니다. 원티드랩이 2024년 디자인 라이브러리로 처음 선보인 뒤, 2025년 에이전틱 디자인 시스템 'Montage'로 확장하여 CC BY 4.0 오픈소스로 공개했습니다. 'From Separate Core Blocks To a Seamless Flow'를 슬로건으로, AI가 디자인을 읽고 생성할 수 있도록 설계된 것이 특징입니다.

### Q: Wanted Design System (Montage)의 핵심 디자인 원칙은 무엇인가요?
A: Wanted Design System (Montage)의 핵심 원칙은 Modularity — 독립적 재사용 가능한 컴포넌트 단위, Seamlessness — iOS, Android, Web 모두 하나의 시스템, Openness — CC BY 4.0으로 누구나 자유롭게 활용입니다.

### Q: Wanted Design System (Montage)은 어떤 프로젝트에 적합한가요?
A: Wanted Design System (Montage)은 채용 / HR 플랫폼, B2B SaaS 대시보드, 크로스 플랫폼 앱 (iOS + Android + Web), 데이터 중심 콘텐츠 플랫폼, 오픈소스 기반 자체 디자인 시스템 구축, 오픈소스 디자인 시스템을 기반으로 자사 시스템 구축, 한·영·일 다국어 지원이 필요한 서비스, 정보 밀도가 높은 데이터 중심 웹/앱, Figma 기반 디자인-개발 협업 워크플로 등의 프로젝트에 적합합니다.

### Q: Wanted Design System (Montage)의 장단점은 무엇인가요?
A: 장점으로는 CC BY 4.0 오픈소스 — 상업적 사용, 수정, 재배포 자유, 명도 기반 숫자 네이밍으로 직관적 색상 선택 가능, Pretendard JP로 한국어/영어/일본어 동시 지원, Figma UI Kit 공개 (Web + Native 별도 제공), Hover/Active 상태를 Opacity 프레임으로 처리하여 색상 관리 단순화이 있습니다. 단점으로는 2024년 공개된 비교적 새로운 시스템으로 커뮤니티 생태계가 작음, Wanted Sans 커스텀 폰트는 별도 적용 필요, 채용 도메인 최적화로 타 도메인에 그대로 적용 시 일부 컴포넌트 부족 가능이 있습니다.

### Q: Wanted Design System (Montage)에서 색상은 어떻게 사용하나요?
A: 명도 기반 넘버링(0=Black, 100=White)의 시맨틱 컬러 토큰 시스템으로, Primary Blue를 5단위로 세분화하고 Opacity 프레임으로 상호작용 상태를 표현 색상 역할은 primary: Blue 계열 — Normal/Strong/Heavy 3단계로 중요도 표현, label: Normal~Disable 6단계로 텍스트 위계 표현, fill: Normal/Strong/Alternative 3단계 투명도 포함 배경입니다. 주의사항: Cool Neutral 팔레트 21단계 — 무채색에도 미세한 쿨톤 적용, Line 컬러는 투명값 포함이므로 중첩 사용 금지 — 중첩 시 Line-Solid 사용.

### Q: Wanted Design System (Montage)에 어울리는 폰트 스타일은 무엇인가요?
A: Wanted Design System (Montage)에는 Pretendard JP — 한국어/영어/일본어를 단일 폰트로 지원하는 현대적 산세리프 폰트가 적합합니다. 최대 1개 폰트 패밀리 사용을 권장합니다. 제약 사항: Display(56~36px) → Title(32~24px) → Heading(22~20px) → Headline(18~17px) → Body(16~15px) → Label(14~13px) → Caption(12~11px) 19단계 스케일, Body/Label은 Normal(일반)과 Reading(긴 텍스트) 두 가지 행간 제공.

### Q: Wanted Design System (Montage) 디자인에서 하면 안 되는 것은 무엇인가요?
A: Wanted Design System (Montage)에서 피해야 할 것: 시맨틱 토큰을 무시하고 Atomic 컬러 직접 사용 금지, Line 컬러(투명값)를 중첩하여 사용 금지 — Line-Solid로 대체, 4px 기반 스페이싱 규칙을 벗어나는 임의 간격 사용 금지, Elevation 레벨을 건너뛰어 깊이 관계 모호하게 만들기 금지.

### Q: Wanted Design System (Montage)을 사용하는 실제 서비스나 제품은 무엇이 있나요?
A: Wanted Design System (Montage)을 적용한 대표적인 제품·서비스로는 원티드 (채용 플랫폼), 원티드긱스 (프리랜서 매칭), 원티드인사이트 (HR 솔루션), 원티드스페이스 (커리어 콘텐츠) 등이 있습니다.

## API 엔드포인트
- 스타일 상세: https://ui.buildersgate.com/api/styles?id=wanted-montage
- 디자인 토큰: https://ui.buildersgate.com/api/themes?id=wanted-montage&merged=true

이 페이지 주소를 AI에게 보여주고 "디자인 시스템 문서를 만들어줘"라고 해보세요.

← 홈으로 돌아가기

Wanted Design System (Montage)

CC BY 4.0 오픈소스 디자인 시스템으로, 명도 기반 넘버링 컬러 체계(0=Black, 100=White), Pretendard JP 타이포그래피, 5단계 Normal/Spread 엘리베이션, 7개 카테고리 40+개 컴포넌트를 갖춘 원티드의 크로스 플랫폼 디자인 시스템입니다.

연도

2024

제작자

Wanted Lab (원티드랩)

원티드랩이 2024년 디자인 라이브러리로 처음 선보인 뒤, 2025년 에이전틱 디자인 시스템 'Montage'로 확장하여 CC BY 4.0 오픈소스로 공개했습니다. 'From Separate Core Blocks To a Seamless Flow'를 슬로건으로, AI가 디자인을 읽고 생성할 수 있도록 설계된 것이 특징입니다.

#3366FF

핵심 원칙

1

Modularity — 독립적 재사용 가능한 컴포넌트 단위

2

Seamlessness — iOS, Android, Web 모두 하나의 시스템

3

Openness — CC BY 4.0으로 누구나 자유롭게 활용

주요 특징

  • 명도 기반 컬러 넘버링 (0=Black, 100=White)
  • Normal/Spread 듀얼 엘리베이션 시스템
  • Pretendard JP 기반 19단계 타이포 스케일
  • 4px 기반 스페이싱 + 8px 그리드
  • CC BY 4.0 오픈소스 라이선스

장단점

장점

  • +CC BY 4.0 오픈소스 — 상업적 사용, 수정, 재배포 자유
  • +명도 기반 숫자 네이밍으로 직관적 색상 선택 가능
  • +Pretendard JP로 한국어/영어/일본어 동시 지원
  • +Figma UI Kit 공개 (Web + Native 별도 제공)
  • +Hover/Active 상태를 Opacity 프레임으로 처리하여 색상 관리 단순화

단점 / 한계

  • −2024년 공개된 비교적 새로운 시스템으로 커뮤니티 생태계가 작음
  • −Wanted Sans 커스텀 폰트는 별도 적용 필요
  • −채용 도메인 최적화로 타 도메인에 그대로 적용 시 일부 컴포넌트 부족 가능

적합한 사용처

사용 사례

  • 채용 / HR 플랫폼
  • B2B SaaS 대시보드
  • 크로스 플랫폼 앱 (iOS + Android + Web)
  • 데이터 중심 콘텐츠 플랫폼
  • 오픈소스 기반 자체 디자인 시스템 구축

이런 프로젝트에 추천

오픈소스 디자인 시스템을 기반으로 자사 시스템 구축한·영·일 다국어 지원이 필요한 서비스정보 밀도가 높은 데이터 중심 웹/앱Figma 기반 디자인-개발 협업 워크플로
접근성

시맨틱 컬러 토큰으로 Label(Normal~Disable), Status(Positive/Cautionary/Negative), Interaction(Inactive/Disable) 등 상태별 색상을 체계적으로 정의하며, Static White/Black으로 테마 변경에도 고정 대비를 보장합니다.

실제 사용 예시

원티드 (채용 플랫폼)원티드긱스 (프리랜서 매칭)원티드인사이트 (HR 솔루션)원티드스페이스 (커리어 콘텐츠)

UI 컴포넌트 예제

이 디자인 스타일의 특징을 반영한 실제 UI 컴포넌트들입니다.

Montage Buttons

Actions 카테고리 — Button, Text Button, Icon Button 컴포넌트

Montage List Cell & Card

Contents 카테고리 — 정보를 구조화하는 리스트 셀과 카드

KR

김리쿠르터

Product Designer

신규
LM

이매니저

Engineering Manager

면접
PD

박디자이너

UX Researcher

합격

Montage Semantic Colors

Primary, Label, Fill, Line, Status — 역할별 시맨틱 컬러 토큰

Primary (Normal / Strong / Heavy)

Normal
Strong
Heavy

Label (Normal → Disable)

Normal

Strong

Neutral

Alternative

Assistive

Disable

Status

Positive
Cautionary
Negative

Montage Elevation

Normal 타입 — Ambient + Key Shadow 레이어링으로 자연스러운 깊이감

None

Normal

XSmall

Normal

Small

Normal

Medium

Normal

Large

Normal

Montage Input Fields

Selection & Input 카테고리 — Text Field, Search Field, Select

년개월

Montage Navigation & Tab

Navigations 카테고리 — Top Navigation, Tab, Bottom Navigation

채용공고

Montage Typography

Pretendard JP 기반 — Display(56px)부터 Caption(11px)까지 19단계 스케일

Display 2 (40px / -0.028em)

Montage

Title 1 (32px / -0.025em)

채용의 새로운 기준

Heading 1 (22px / -0.019em)

지금 당장 지원해보세요

Body 1 Normal (16px / +0.006em)

원티드 디자인 시스템 Montage는 CC BY 4.0 오픈소스로 공개되었으며, iOS, Android, Web 모든 환경에서 일관된 사용자 경험을 제공합니다.

Label 1 Normal (14px / +0.015em)

Wanted Lab · 2024 · CC BY 4.0 Open Source

Caption 1 (12px / +0.025em)

큰 텍스트 → 음수 자간(-) · 작은 텍스트 → 양수 자간(+)

자주 묻는 질문

Wanted Design System (Montage)이란 무엇인가요?
CC BY 4.0 오픈소스 디자인 시스템으로, 명도 기반 넘버링 컬러 체계(0=Black, 100=White), Pretendard JP 타이포그래피, 5단계 Normal/Spread 엘리베이션, 7개 카테고리 40+개 컴포넌트를 갖춘 원티드의 크로스 플랫폼 디자인 시스템입니다. 원티드랩이 2024년 디자인 라이브러리로 처음 선보인 뒤, 2025년 에이전틱 디자인 시스템 'Montage'로 확장하여 CC BY 4.0 오픈소스로 공개했습니다. 'From Separate Core Blocks To a Seamless Flow'를 슬로건으로, AI가 디자인을 읽고 생성할 수 있도록 설계된 것이 특징입니다.
Wanted Design System (Montage)의 핵심 디자인 원칙은 무엇인가요?
Wanted Design System (Montage)의 핵심 원칙은 Modularity — 독립적 재사용 가능한 컴포넌트 단위, Seamlessness — iOS, Android, Web 모두 하나의 시스템, Openness — CC BY 4.0으로 누구나 자유롭게 활용입니다.
Wanted Design System (Montage)은 어떤 프로젝트에 적합한가요?
Wanted Design System (Montage)은 채용 / HR 플랫폼, B2B SaaS 대시보드, 크로스 플랫폼 앱 (iOS + Android + Web), 데이터 중심 콘텐츠 플랫폼, 오픈소스 기반 자체 디자인 시스템 구축, 오픈소스 디자인 시스템을 기반으로 자사 시스템 구축, 한·영·일 다국어 지원이 필요한 서비스, 정보 밀도가 높은 데이터 중심 웹/앱, Figma 기반 디자인-개발 협업 워크플로 등의 프로젝트에 적합합니다.
Wanted Design System (Montage)의 장단점은 무엇인가요?
장점으로는 CC BY 4.0 오픈소스 — 상업적 사용, 수정, 재배포 자유, 명도 기반 숫자 네이밍으로 직관적 색상 선택 가능, Pretendard JP로 한국어/영어/일본어 동시 지원, Figma UI Kit 공개 (Web + Native 별도 제공), Hover/Active 상태를 Opacity 프레임으로 처리하여 색상 관리 단순화이 있습니다. 단점으로는 2024년 공개된 비교적 새로운 시스템으로 커뮤니티 생태계가 작음, Wanted Sans 커스텀 폰트는 별도 적용 필요, 채용 도메인 최적화로 타 도메인에 그대로 적용 시 일부 컴포넌트 부족 가능이 있습니다.
Wanted Design System (Montage)에서 색상은 어떻게 사용하나요?
명도 기반 넘버링(0=Black, 100=White)의 시맨틱 컬러 토큰 시스템으로, Primary Blue를 5단위로 세분화하고 Opacity 프레임으로 상호작용 상태를 표현 색상 역할은 primary: Blue 계열 — Normal/Strong/Heavy 3단계로 중요도 표현, label: Normal~Disable 6단계로 텍스트 위계 표현, fill: Normal/Strong/Alternative 3단계 투명도 포함 배경입니다. 주의사항: Cool Neutral 팔레트 21단계 — 무채색에도 미세한 쿨톤 적용, Line 컬러는 투명값 포함이므로 중첩 사용 금지 — 중첩 시 Line-Solid 사용.
Wanted Design System (Montage)에 어울리는 폰트 스타일은 무엇인가요?
Wanted Design System (Montage)에는 Pretendard JP — 한국어/영어/일본어를 단일 폰트로 지원하는 현대적 산세리프 폰트가 적합합니다. 최대 1개 폰트 패밀리 사용을 권장합니다. 제약 사항: Display(56~36px) → Title(32~24px) → Heading(22~20px) → Headline(18~17px) → Body(16~15px) → Label(14~13px) → Caption(12~11px) 19단계 스케일, Body/Label은 Normal(일반)과 Reading(긴 텍스트) 두 가지 행간 제공.
Wanted Design System (Montage) 디자인에서 하면 안 되는 것은 무엇인가요?
Wanted Design System (Montage)에서 피해야 할 것: 시맨틱 토큰을 무시하고 Atomic 컬러 직접 사용 금지, Line 컬러(투명값)를 중첩하여 사용 금지 — Line-Solid로 대체, 4px 기반 스페이싱 규칙을 벗어나는 임의 간격 사용 금지, Elevation 레벨을 건너뛰어 깊이 관계 모호하게 만들기 금지.
Wanted Design System (Montage)을 사용하는 실제 서비스나 제품은 무엇이 있나요?
Wanted Design System (Montage)을 적용한 대표적인 제품·서비스로는 원티드 (채용 플랫폼), 원티드긱스 (프리랜서 매칭), 원티드인사이트 (HR 솔루션), 원티드스페이스 (커리어 콘텐츠) 등이 있습니다.

관련 스타일 탐색

Toss Design System (TDS)

OKLCH 색공간 기반의 정교한 컬러 시스템, 파생 가능한 테마 시스템, 11개 핵심 컴포넌트를 갖춘 토스의 디자인 시스템으로 금융 앱부터 슈퍼앱, POS, 글로벌까지 확장 가능한 System of System 구조입니다.

Atlassian Design System

아틀라시안의 제품군에 사용되는 디자인 시스템입니다.

Carbon Design System

IBM의 오픈소스 디자인 시스템으로, 엔터프라이즈 제품에 최적화되어 있습니다.

Ant Design

엔터프라이즈급 UI 디자인 언어로, 중국 알리바바 그룹에서 개발했습니다.