Back to Plugins
DesignSystemColours

DesignSystemColours

<p>A tool to speed up the process of creating the colour palette of a design system.</p><p><br></p><p>With this tool, colour styles will automatically be added, using the standard BEM naming convention, making access and usage during design as easy as possible.</p><p><br></p><p><strong>How to use:</strong></p><p><br></p><ol><li>Find a colour you want to use in your design.</li><li>Convert the colour to HEX (or RGB) format and make a note of the value(s).</li><li>Input these values to the plugin, and the rest will be done for you!</li></ol><p><br></p><p>If you have any suggestions for how this plugin could be improved, please let me know :)</p><p><br></p><p>Comment how you find the plugin, and how much it improves your design system process - I would be really interested to know if you find it useful.</p>

Plugin Preview

DesignSystemColours preview

About this plugin

A tool to speed up the process of creating the colour palette of a design system.


With this tool, colour styles will automatically be added, using the standard BEM naming convention, making access and usage during design as easy as possible.


How to use:


  1. Find a colour you want to use in your design.
  2. Convert the colour to HEX (or RGB) format and make a note of the value(s).
  3. Input these values to the plugin, and the rest will be done for you!


If you have any suggestions for how this plugin could be improved, please let me know :)


Comment how you find the plugin, and how much it improves your design system process - I would be really interested to know if you find it useful.

Plugin Details

Version3
CreatedJuly 26, 2022
Last UpdatedAugust 24, 2022
Categoryshapes-colors
CreatorSam Ireson
Stats124 installs, 14 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Editor Types:
    figma

More Like This

Discover other plugins in the shapes-colors category.