carbon-design-system/carbon

IBM의 오픈소스 디자인 시스템으로 React, Web Components, SCSS 등 다양한 기술 스택을 지원하는 엔터프라이즈급 UI 컴포넌트 라이브러리

개발 재료맘대로 써도 됨 · Apache-2.0디자인·UI 컴포넌트TypeScript난이도
9,251+17이번 주0 찜
2,213포크989이슈
데모·홈페이지 열기carbondesignsystem.com

중간맛 분석

TypeScript/SCSS 기반이며 @carbon/react(React 컴포넌트), @carbon/web-components(Web Components), @carbon/styles(SCSS 스타일) 등 12개 이상의 패키지로 구성되어 있습니다. Lerna로 모노레포 관리되며 접근성(A11y)과 마이그레이션 가이드가 충실합니다. 바로 설치해서 프로덕션 UI를 빌드할 수 있으며 Angular, Svelte, Vue 커뮤니티 버전도 존재합니다.

이런 레포예요

이럴 때 쓰면 좋아요

  • React 또는 Web Components 기반의 엔터프라이즈 웹 애플리케이션을 빠르게 구축할 때
  • IBM 디자인 언어를 따르는 조직의 모든 제품에 일관된 UI를 적용하고 싶을 때
  • 접근성과 국제화가 필수인 대규모 프로젝트에서 검증된 컴포넌트를 재사용하고 싶을 때

핵심 기능

다중 프레임워크 지원 (React, Web Components, Angular, Svelte, Vue)IBM Design Language 기반의 완성된 디자인 토큰 및 컴포넌트 라이브러리기본 탑재된 접근성(A11y) 및 국제화 지원

대안 대비 차별점

모노레포 구조로 세분화된 디자인 토큰 패키지를 제공해 선택적 의존성 관리가 가능하며, IBM의 엔터프라이즈 수준 표준화와 9000+ 스타의 커뮤니티가 뒷받침하는 성숙한 생태계를 갖추고 있습니다.

준비물

  • Node.js
  • npm 또는 yarn

별 추이 · 7일

9,251+17 / 7일

활용성 · 따라 만들기 좋은가

베스트 샘플샘플 점수 62/100
  • 관대한 라이선스
  • 테스트 있음
  • 예제 디렉토리
  • 최근 활동
  • AGENTS.md
  • llms.txt
  • 템플릿

🟢 최근 활동 있음 · 2017년 생성

이 레포에 깃밥 배지 달기

[![깃밥](https://www.gitbap.com/badge/carbon-design-system/carbon.svg)](https://www.gitbap.com/r/carbon-design-system/carbon)

🔌 클로드에서 바로 써보기

깃밥을 클로드에 연결하면 이런 레포를 클로드·커서·Codex에서 바로 찾고 체험할 수 있어요.

방법 ① 커넥터 URL

클로드 설정 → 커넥터에 이 주소를 붙여넣기.

https://www.gitbap.com/api/mcp
방법 ② 플러그인 (체험까지)

플러그인을 설치하면 /gitbap-trending·/gitbap-try 슬래시 커맨드로 레포를 그 자리에서 체험. Claude Code에서 아래 두 줄을 차례로 실행하세요.

/plugin marketplace add jakeparkcolde/gitbap-cowork
/plugin install gitbap-cowork@gitbap
연결 방법 자세히 →

AI가 README 기반으로 요약했습니다 · 원문 보기