A transparent discovery signal based on current public GitHub metadata.
Recent activity35% weight
100
Community adoption25% weight
45
Maintenance state20% weight
40
License clarity10% weight
100
Project information10% weight
100
This score does not audit code, security, maintainers, documentation quality, or suitability. Verify the repository and its current documentation before adoption.
README preview
Carbon for IBM Products
Carbon for IBM Products is an open source implementation of the closed source
IBM Software pattern asset library (PAL).
These PAL designs build on the foundation of IBM’s open source Carbon Design
System and React implementation to offer components and patterns beyond the
typical component library. Carbon for IBM Products was previously known as
Carbon for Cloud and Cognitive, and this name can still be encountered in
various places and historical logs.
🚀 Getting started
If you’re just getting started and looking to browse our React components, take
a look at our Storybook.
All of our source code and documentation, including this readme, can be found on
our GitHub repo, which
is also the place to
open issues
if you have a problem or find a defect or would like to request a new feature or
change something.
If you have access to the IBM Slack workspaces, join
where
you can ask questions, report problems, and get help from the team and from
other users.
If you’d like to learn more about migrating from Carbon 10 to Carbon 11, please
see the Carbon
v11 migration guide
(which includes codemods via
@carbon/upgrade)
and the Carbon for IBM Products
v2 migration guide.
Installation
Using npm: npm install @carbon/ibm-products
If you prefer Yarn: yarn add @carbon/ibm-products
Styles
The @carbon/ibm-products package provides several options for importing the
package styles:
// Include all the styles, including Carbon and experimental styles@use '@carbon/ibm-products/css/index.min.css';
// Include only styles from @carbon/ibm-products@use '@carbon/ibm-products/css/index-without-carbon.css';
// Include only styles from @carbon/ibm-products, excluding experimental
styles@use '@carbon/ibm-products/css/index-without-carbon-released-only.css';
// Include all styles from carbon@use '@carbon/ibm-products/css/index-full-carbon.css';
To include the styles for a specific component:
// Bring in the styles for one component@use '@carbon/ibm-products/scss/components/AboutModal';
You can also leverage the Carbon for IBM Products styles independently of the
React package using the
@carbon/ibm-products-styles
package.
import {
previewCandidate__Toolbar,
previewCandidate__SearchBar,
} from '@carbon/ibm-products';
Using aliases for cleaner code:
import { previewCandidate__Toolbar as Toolbar } from '@carbon/ibm-products';
// Use without prefix in your code
<Toolbar>...</Toolbar>;
Migrating from feature flags: If you're currently using the deprecated
canary feature flag mechanism (pkg.component.*), see the
Canary Migration Guide
for step-by-step instructions on updating your code.
This project is made possible by several community members who have invested
their precious time to give back to the Carbon community. It will continue to be
possible by having those that benefit from the package contribute back to it.
So, do not be shy. We both depend on and appreciate contributors, new and old,
who help us fix bugs, build new features, improve our documentation, etc.
This repository is a monorepo and contains multiple packages so be sure to check
the relevant package for any package-specific guidance.
