color-palettes.md 843 B

+++ title = "Color palettes" +++

There's no reason why your Cupper-powered pattern library has to be all about functionality. You can include style guide-like information such as color palettes too. The colors shortcode makes it easy to exhibit colors and their values together. Just supply a comma-separated list of CSS color values.

{{}} {{% colors "#111111, #cccccc, #ffffff" %}} {{}}

The result is a one row strip showing each color supplied in order. The colors for Cupper are greyscale:

{{% colors "#111111, #cccccc, #ffffff" %}}

{{% note %}} If you're wondering whether you need to put a space after the commas in the shortcode, don't worry: "#254f7b, #579a6d, #666666" and "#254f7b,#579a6d,#666666" are both accepted. Any CSS color value is acceptable, not just hex colors. {{% /note %}}