---
title: "FoundationNG Steps Component Pictogram / Done Icons Config"
description: "The FoundationNG Steps Component Pictogram / Done Icons Config is used to define which Pictograms are available for Steps Component, as well as which Icons are available to be used for EyeCatcher, Basic Teaser, Steps, Tags."
path: https://www.eonshowroom.eon.com/en/aem-basics/configuration-pages/foundationng-steps-component-pictogram-done-icons-config.html
lastModified: 2024-11-08T10:06:14.093Z
---

# FoundationNG Steps Component Pictogram / Done Icons Config

# FoundationNG Steps Component Pictogram / Done Icons Config

The FoundationNG Steps Component Pictogram / Done Icons Config is used to define which Pictograms are available for Steps Component, as well as which Icons are available to be used for following Components:

[Eye Catcher](https://www.eonshowroom.eon.com/en/specials/eye-catcher.html)

[Basic Teaser](https://www.eonshowroom.eon.com/en/teasers-and-highlights/basic-teaser.html)

[Steps](https://www.eonshowroom.eon.com/en/specials/steps.html)

[Tags](https://www.eonshowroom.eon.com/en/aem-basics/tagging.html)

### Usage

If it should be the same for all Pages, do it on Homepage Configuration Page.

Use CAC only if it should be changed for just some Subpages.

## Configuration

![](https://www.eonshowroom.eon.com/cdm-assets/is/image/eon/EON_Pattern_4-1%3A3-1?fmt=webp-alpha)

![FoundationNG Steps Component Pictogram / Done Icons Config](https://www.eonshowroom.eon.com/cdm-assets/is/image/eon/foundation-ng_steps-component-pictogram-done-icons-config%3A2-1?fmt=webp)

### Options of FoundationNG Steps Component Pictogram / Done Icons Config

After Editing is enabled for FoundationNG Steps Component Pictogram / Done Icons Config, the following can be edited:

- List of Done Icons
- List of Pictograms

For both Lists, multiple Icons / Pictograms can be added or deleted.

For Deleting an Icon / Pictogram, Editor needs to click the Minus Icon (**-**) of the Line that should be deleted.

For Adding an Icon / Pictogram, Editor needs to click on a Plus Icon (**+**). This adds a new empty Line under the Line of clicked Plus Icon. There, the Name of the Icon / Pictogram needs to be added.

It is adviceble to have a Sorting Order (needs to be done manual) e.g. alphabetical. This will make it easier to find a specific Icon / Pictogram in a long List.

[List of FoundationNG Icons on Storybook](https://storybook.web-ui.eon.com/eon/master/?path=/story/media-icon--all-icons)

[List of FoundationNG Pictograms on Storybook](https://storybook.web-ui.eon.com/eon/master/?path=/story/media-pictogram--all-pictograms)

[Find out more about Steps](https://www.eonshowroom.eon.com/en/specials/steps.html)
