Carbon Design Kit

The Carbon Design Kit is a living, breathing document that contains all of our visual assets (components, iconography, color palettes, grids, templates, responsive behavior, etc). This document evolves and changes as we collaborate with partners and service teams. All of the assets that live in the Design Kit can also be found on our Carbon Design System website.

📝 Change Log

Contains release notes on current and previous versions of the Carbon Design Kit.

• 8.x.x
• 1.0.4 and older

🔍 Accessibility

All of the designs within the Carbon Design Kit meet the WCAG 2.0 AA accessibility guidelines and are compliant with Section 508 standards. If you choose to customize these designs, please make sure they continue to meet these requirements.

📚 Getting Started

Designers

• The Carbon Design Kit now uses the new typeface IBM Plex. It is open sourced and free to download from the IBM GitHub repo

• Download the latest version of the Carbon Design Kit by clicking on the latest kit file in this repo (Carbon_Design-Kit_x.x.x.sketch) then on the next page click the download button or “View Raw”. (Note: downloading from the main repo page will download the entire repo including previous version)

• The Design Kit requires having the latest version of Sketch installed.

• Open the Design Kit file in Sketch

• Core visual styles, components, and templates are broken out into respective pages

• Use the components and core visual styles to build out your design

• Updates to the Design Kit will be posted in our change log, so check back frequently for changes!

Developers:

Our Carbon Components Getting Started guide has all the instructions you need to get up and running our code base.

For Carbon Data Visualizations please head over to this guide for instructions.

🌟 Contributing

Design

Follow the steps in our Contributing guidelines to contribute to the Carbon Design System.

Code

For instructions on contributing to our component library please read our contributing docs for Carbon Components.

💻 Workflow

Sketch Libraries

Sketch Libraries is a new Sketch feature that allows designers to share Symbols across documents and easily update to the latest symbol changes. Read the Sketch Libraries Overview wiki to learn more about how to use and implement Sketch Libraries in your workflow.

Plugins

The Carbon Design Kit now comes with the Sketch Palettes plugin which allows you to import Carbon specific palettes into your Sketch files. There are four Carbon palettes (a Carbon default palette and three data vis palettes) included with the Carbon Design Kit download. We also have a wiki of suggested Sketch plugins to help make your design workflow more efficient.

Copyright © 2016, 2017, 2018 IBM