diff --git a/packages/foundations/docs/Icons.md b/packages/foundations/docs/Icons.md index 78294ae27f9..0986e7d7927 100644 --- a/packages/foundations/docs/Icons.md +++ b/packages/foundations/docs/Icons.md @@ -3,6 +3,7 @@ - We use icon fonts as **woff2** files for all our icons. - We auto generate these files out of `.svg` files. - A lot of our [components](../../components/readme) have an `icon` property you can pass in. +- Use the CSS Custom Property `--db-icon-color` to overwrite the icons color. ## How to include icons @@ -19,6 +20,10 @@ You can add an icon before or after a tag, by adding an `data-` attribute to you | `before` | `data-icon="icon-from-overview"` | | `after` | `data-icon-after="icon-from-overview"` | +### Icons color + +You could use the CSS Custom Property `--db-icon-color` to overwrite the icons color, be it icon fonts or when using the SVG files directly. Or `--db-icon-pulse-color` for the illustrative icons pulse color. + ## Custom Icons If you have custom icons and want to use them for foundations and/or in components, you need to generate a **woff2** file.