grafana/public/img/icons
2024-05-29 09:49:59 +01:00
..
custom Grafana/ui: Fix traces icon (#86984) 2024-04-29 17:55:55 +03:00
iot Canvas add drone elements (#43122) 2021-12-16 11:05:58 -08:00
marker XYChart: Improve base options setup (#67878) 2023-07-10 17:54:01 -07:00
mono PanelChrome: Refactor and refine items next to title (#60514) 2023-01-16 15:56:39 +00:00
solid Icons: Move unicons icons to the repository and generate the iconsBundle.js with nodejs (#53766) 2022-08-23 15:47:14 +02:00
unicons Add Kubernetes icon (#86677) 2024-05-29 09:49:59 +01:00
README.md Fix frontend-observability icon fill colour (#82326) 2024-02-12 19:31:14 +02:00

How to add a new icon

  • Add the new icon svg to the unicons/ directory
    • Yes, even if it's not a unicon icon or from IconScout
    • We will eventually condense all the separate folders into a single icons/ directory, and since unicons/ is the default it makes sense to add new icons there
  • Ensure the new icon source is formatted correctly:
    • Remove any width or height attributes
    • If the icon is a single color, ensure any explicitly defined fill or stroke colors are either removed (or set to currentColor if a color must be defined)
      • This allows the consumer to control the color of the Icon, which is useful for hover/focus states
  • Modify the availableIconsIndex map in @grafana/data and add the new icon
    • Note: the key must exactly match the icon filename, e.g. if your new icon is my-icon.svg, the key must be my-icon
  • Run yarn storybook and verify the new icon appears correctly in the Icon story