Carbon Design System
Carbon is an open-source design system built by IBM. With the IBM Design
Language as its foundation, the system consists of working code, design tools
and resources, human interface guidelines, and a vibrant community of
contributors.
Getting started
If you're just getting started, check out @carbon/react or
@carbon/web-components.
We also have community-contributed components for the following technologies:
If you're trying to find something specific, here's a full list of packages that
we support!
| Package name | Description |
|---|---|
@carbon/react |
React components and styles |
@carbon/web-components |
Web Components |
@carbon/styles |
Sass styles for components |
@carbon/elements |
IBM Design Language elements like colors, type, iconography, and more |
@carbon/colors |
Work with IBM Design Language colors |
@carbon/grid |
Build layouts using the new 16 column grid system |
@carbon/icons |
Iconography assets. We also offer support in: React, Angular, Vue, and Svelte |
@carbon/pictograms |
Pictogram assets. We also offer support in: React and Svelte |
@carbon/layout |
Layout-based units and spacing scale |
@carbon/motion |
Productive and expressive motion curves |
@carbon/themes |
Color tokens available in the Carbon Design System, like $interactive-01 |
@carbon/type |
New type tokens used alongside IBM Plex |
Note
The code for https://carbondesignsystem.com/ is in
https://github.com/carbon-design-system/carbon-website. Any issues or pull
requests related to the website should be made there.
๐ Documentation
- See our documentation site
here for
full how-to docs and guidelines - Contributing: Guidelines for making contributions
to this repo. - ๐โโ๏ธ Migration Guides
๐ Contributing
We're always looking for contributors to help us fix bugs, build new features,
or help us improve the project documentation. If you're interested, definitely
check out our Contributing Guide and our
Developer Guide! ๐
Contributors
This project follows the
all-contributors
specification. Contributions of any kind welcome!
๐ License
Licensed under the Apache 2.0 License.