Carbon Design System

Carbon is IBM's design system published in full: working code, Figma libraries, design guidelines and written standards, all maintained as one artefact rather than as a component package with documentation bolted on.

At a glance

Install	npm install @carbon/react
Frameworks	React, Web Components, Angular, Vue
Styling	Sass with the IBM Design Language token layer
Accessibility	treated as a compliance requirement
MCP server	not published, llms.txt available
License	Apache-2.0

Install

npm install @carbon/react

import { Button, DataTable, Theme } from '@carbon/react'

<Theme theme="g100">
  <Button kind="primary">Save changes</Button>
</Theme>

Accessibility is the reason to pick it

IBM sells to governments and regulated industries, so Carbon's accessibility is documented against standards rather than described in general terms. If your procurement process asks for a VPAT or conformance evidence, this is one of the very few options in this directory where that paperwork already exists.

The catch is the identity

Carbon looks like IBM, and it is designed to. The type, the grid and the interaction patterns carry the IBM Design Language, and neutralising that is fighting the system rather than configuring it. Adopt it when that visual heritage is acceptable, not when you need your own brand.

Choose it if

• You need documented accessibility conformance for procurement.
• You want design, code and guidelines maintained as a single source.
• You ship the same product across several frameworks.

Look elsewhere if

• You need a neutral visual base for your own brand.
• Apache-2.0 does not suit your legal review.