UNDP Design System

official U.S. government 프레임워크 를 위한 consistent, accessible public digital services.

제품 개요

The U.S. Web Design System (USWDS) is the official open-source design system from the U.S. federal government (managed by GSA), providing reusable components, patterns, and guidelines to build consistent, accessible, and performant digital experiences for public-facing government websites and services. It ensures compliance with Section 508 accessibility standards and federal branding, helping agencies deliver user-centered, trustworthy interfaces efficiently. Component Library: Reusable elements like buttons, forms, alerts, accordions, grids, and navigation with variants. Design Tokens: Colors (federal palette), typography, spacing, icons, and utilities for consistency. Accessibility: Full Section 508/WCAG 2.1 AA compliance with ARIA support. Tools: Figma kit for prototyping; code packages for HTML/CSS and React.

주요 기능

컴포넌트 라이브러리: Reusable elements 같은 buttons, forms, alerts, accordions, grids, 및 navigation 를 사용한 variants.
디자인 토큰: 색상 (federal 팔레트), 타이포그래피, 간격, 아이콘, 및 utilities 를 위한 consistency.
접근성: 전체 Section 508/WCAG 2.1 AA compliance 를 사용한 ARIA 지원.
도구: Figma 키트 를 위한 프로토타이핑; 코드 packages 를 위한 HTML/CSS 및 React.

장점

+오픈 소스
+방대한 아이콘 라이브러리
+색상 팔레트 생성
+CSS/디자인 도구로 내보내기

단점

-도입 시 팀 조율 필요
-커스터마이징이 복잡할 수 있음

/// 스펙

가격:
Free
플랫폼:
Browser

ASSETS_DIRECTORY

figma

/// 유사 도구

Radius Design System

Rangle's Meta-프레임워크 accelerating custom 디자인 시스템 creation 를 사용한 도구 및 키트.

Salt Design System

J.P. Morgan's 오픈소스 프레임워크 를 위한 accessible, 사용자 정의 가능 financial interfaces.

Slack Block Kit

modular UI 프레임워크 를 위한 구축 풍부한, 인터랙티브 messages 및 apps 에서 Slack.

SmartHR UI

오픈소스 React 컴포넌트 라이브러리 를 위한 consistent, accessible HR 플랫폼 interfaces.

U.S. Web Design System

웹 디자인 시스템: official U.S. government 프레임워크 를 위한 consistent, accessible public digital services.

VKUI

VK's 오픈소스 React 라이브러리 를 위한 consistent, accessible interfaces 에서 VK apps 및 services.

VTEX Design System

오픈소스 프레임워크 를 위한 consistent, accessible e-commerce interfaces.

Vaadin Design System

오픈소스 프레임워크 를 위한 consistent, accessible enterprise 웹 apps 를 사용한 웹 컴포넌트.

Vibe Design System

monday.com's 오픈소스 디자인 시스템 를 위한 consistent, accessible 작업 management interfaces.

Watt Design System

Holaluz's Figma-기반 UI 키트 를 위한 consistent, accessible renewable energy interfaces.