What is Carbon?

A design system is a collection of pre-built, reusable assets—components, patterns, guidance, and code—that allows its users to build consistent digital experiences faster. By using the pre-built and universal assets of Carbon, the time teams spend designing and building is minimized. Instead of building and re-building basic elements, they can spend that time customizing their products to address specific client use cases.

The design system is named Carbon Design System because in nature the element carbon builds complex structures from simpler compounds. This motif mimics how our individual styles and components can combine to make beautifully complex, natural, and intuitive designs.

Carbon is funded and built by IBM, which means we build for the company’s business needs, but we’ve made it open source for anyone to use and contribute back to. While being primarily open source, Carbon also serves various parts of the IBM business that follow an inner source model.

Learn about Carbon and its history. This video covers how the IBM Design Language is applied to Carbon, how Carbon interacts with domain level guidance, and what it means to be an open source design system.

The Carbon team is committed to helping members of the community be successful in adoption and their use of Carbon assets.

Carbon is open. The design system is a distributed effort, guided by the principles of the open source movement. Carbon’s users are also its makers, and everyone is encouraged to contribute.

Carbon is inclusive. It’s designed and built to be accessible to all, regardless of ability or situation.

Carbon is modular and flexible. The system’s modularity ensures maximum flexibility in execution. Its components are designed to work seamlessly with each other, in whichever combination suits the needs of the user.

Carbon puts the user first. Using rigorous research into users’ needs and desires, Carbon is laser-focused on real people.

Carbon builds consistency. Based on the IBM Design Language, every element and component of Carbon was designed from the ground up to work elegantly together to ensure consistent, cohesive user experiences.

Carbon maintains design kits in Figma. These kits contain components and elements as well as wireframes and guidance to aid designers.

Carbon supports multiple code implementations. These reflect the production-level design libraries. The frameworks are listed below with their primary maintainers:

If you’re using a different framework, you can still build components by following our guidelines for other frameworks.

Design patterns are harvested from products built with Carbon. These become part of the design system. Teams can use these well-defined patterns in their work and contribute patterns back to the system.

We conduct training classes, run meetups, and offer certifications. We offer tutorials in Angular, React, and Vue. We run meetups and design reviews on a regular basis. We’re also available to teach at conferences, bootcamp labs, and wherever else we’re needed.

We engage the community. We strive to be one of the world’s best design systems and we’re always open to feedback. We communicate with you about Carbon’s state and roadmap through GitHub support, blog posts, and Twitter.

Contributed components and patterns include a list of maintainers. The Carbon team triages and supports maintenance requests that do not have a maintainer.

We provide support for users of the design system. The Carbon team engages with users primarily through GitHub. A member of the Carbon team responds to all issues and pull requests.

Carbon compliance by the IBM community is critically important to the IBM brand. Carbon is the digital expression of the IBM brand and the chassis upon which all products and digital experiences are built. It is the foundation for every digital experience people have throughout their relationship with IBM.

Making delightful user experiences rooted in human-centered design, high-quality design standards, and the IBM brand ensures we deliver consistency and excellence to our users, and build a brand that people love across the entire product line.

Have questions? Found a bug? Learn where to go and what to do by visiting the Contact us page.