Pictograms
As IBM continues to innovate with products and services, you may find the need for a new pictogram. Use the design and production guidelines linked here to create one, and review the contribution and approval process required to add it to the official Pictogram library.
Resources
Design and production
Don’t see the pictogram you need in the library? Then make your own. Follow these guidelines to ensure visual consistency and proper formatting.
All design submissions require review and approval before they can be published. Try your best to adhere to these guidelines, but note that your submitted design may change during the review and approval process.
Non-designers may also submit requests using a visual reference or sketch of their desired icon and the brand team will assist with the design. Include context on where and how the icon will be used to help ensure the final design meets your needs.
All pictograms should follow the guidelines outlined here:
- Be unique and not redundant with any existing pictograms in the system. Look through the pictograms in the library to ensure that your proposed new pictogram isn’t already represented.
- Adhere to the IBM Design Language visual style.
- Comply with IBM accessibility standards.
- Be usable across all supported platforms and devices.
- Be understandable by a global audience of users, regardless of nationality or language.
Creating a pictogram
Keep the following in mind when creating a pictogram:
- Use the starter file and create the desired pictogram within the blank workspace artboard. Refer to the Design tab for detailed guidance.
- Make sure 32px pictograms have 1px of padding.
- Set your workspace up to snap to grid.
- Be aware of automatic alignments, which can place vectors on uneven or half pixels.
- Be sure the pictogram is on the top-most layer in your artboard. Strokes should be grouped appropriately.
- Make sure to properly name layers and artboards. These names will also be exported into the code.
Production-ready
To be considered production-ready, all pictogram submissions must be delivered in Adobe Illustrator format at 32px x 32px with strokes kept intact.
- Each artboard and the artwork within it must be aligned to the pixel grid wherever possible.
- All strokes should be kept as is and not converted to shapes.
- Group strokes logically whenever possible.
Approval process
After following this guidance, you may submit your productive or expressive pictogram design draft for approval. The Brand and Design Systems team will review these pictograms and facilitate their publication in the IBM Design Language, Figma and Carbon libraries. These libraries are updated in sprints, not when the icon is approved, so you should account for that additional time in your project planning.
- Submit your first design draft using one of the GitHub issue types, single, batch or update, linked at the bottom of this page. Follow the instructions in the issue to avoid possible delays in the review process.
Note: Non-designers can submit visual references or sketches with context about how the icon will appear in lieu of a design file. - The Brand and Design Systems team will review your submitted design and provide recommendations and design feedback within the GitHub issue.
This review process can take up to 30 days from issue creation, depending on the number of icons submitted. - When your submission is approved, your finalized pictogram will be moved into a production sprint, after which it will appear in the Carbon, IBM Design Language and Figma libraries.
Note: Approved pictograms can be introduced into materials before they’re added to the libraries listed.