---
title: "Specification List"
path: https://www.eonshowroom.eon.com/en/specials/specification-list.html
lastModified: 2025-10-20T11:01:56.496Z
---

# Specification List

# Spe&shy;ci&shy;fi&shy;ca&shy;tion List

[How to Configure](#how-to)

Price: 1,698 €

Efficiency: 20.3 %

Power Output: 370 kW/h

Dimensions: 176.5 x 104.8 cm

### Description

****The **Specification List Component** enables Editors to present Structured Technical Data in a clear, consistent, and accessible Way. It provides a Standardized Layout for displaying product or feature Specifications, ensuring both visual Coherence across pages and easy Content Maintenance.

Within the Component Dialog, Editors can add multiple Specification Items using a Multifield, where each Entry includes an Icon, Label, Value, and Unit. The Component also offers global Configuration Options such as Size, Layout, Alignment, and the Ability to hide Icons, giving Editors flexible Control over Presentation while maintaining a uniform Style that aligns with the Design System (requires UI Kit Version 4.25.0 or higher).

### Inspirations

Wasserstoff: 5 kg

Dimensions: 176.7 x 105.8 cm

Price: 500 €

Wasserstoff: 5 kg

Dimensions: 176.7 x 105.8 cm

Price: 500 €

Wasserstoff: 5 kg

Dimensions: 176.7 x 105.8 cm

Price: 500 €

Wasserstoff: 5 kg

Dimensions: 176.7 x 105.8 cm

Price: 500 €

### Usage Rules & Features

##### Features

- Add multiple Specification Items using a Multifield
- Provide standardized Layout for Product or Feature Specifications

##### Properties

- Global Configuration Options for Size, Layout, Alignment, and Hide Icons
- All Fields mapped to Web Component Attributes

##### Design

- Ensures visually balanced and semantically rich Presentation of Technical Data
- Improves Usability, Accessibility, and Readability

##### In which Grid Columns does it fit?

| Grid Columns | Does it fit? |
| --- | --- |
| 2 | no |
| 3 | no |
| 4 | no |
| 5 | no |
| 6 | yes |
| 8 | yes |
| 9 | yes |
| 10 | yes |
| 12 | no |

##### DO's

- After Publishing, check Form sending works as expected
- Ensure Mulesoft Integration and Configuration is done

[Info Icon Key: info-icon-1]

[Info Icon Aria Label: Mulesoft & MT Captcha Integration]

[Info Icon Content Type: Experience fragment]

[Info Icon Content Start: info-icon-1]

##### Mulesoft & MT Captcha

Mulesoft and MT Captcha are both needed for Forms.

Mulesoft is a Preconditions to use Forms in Foundation 2020 Project. Furthermore, MT Captcha is a Service to make it harder for Bots (no real Users) to misuse a Form.

[Read More about Mulesoft & MT Captcha Integration](https://www.eonshowroom.eon.com/en/aem-basics/configuration-pages/foundationng-form-config.html)

[Info Icon Content End: info-icon-1]

##### DONT's

- Don’t mix layout styles (horizontal + vertical) within the same list

## Configuration

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

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

### Make an Item

- Icon

Select an Icon from the E.ON UI-Kit Llibrary to visually support the respective Attribute.

- Label

The name or title of the specification.

- Value

The numerical or textual value of the specification (e.g., *250*, *10 h*).

- Unit

The unit or suffix that complements the value (e.g., *kg*, *cm*, *hours*).

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

### Style your Item

- Style

Defines the text size and spacing within the list. Options: small or normal

- Layout

Determines whether the specifications are displayed **horizontally** (side by side) or **vertically** (stacked).

- Allignment

Defines the alignment of the content. Options: left or right

- Hide Icons

Hides the selected icons if a text-only presentation is preferred.
