# Descriptions

Source: https://lumeo.nativ.sh/components/descriptions

# Descriptions

A key-value pair list for displaying structured metadata.

## Installation

.NET CLI PackageReference Lumeo CLI

dotnet add package Lumeo

One-time app setup (`AddLumeo()`, CSS & JS) is covered in the [installation guide](docs/introduction).

## Usage

@using Lumeo

<Descriptions />

## When to Use

-   Detail views showing entity information like user profiles or order summaries
-   Product specifications with labeled attribute-value pairs
-   Key-value data display for settings, configuration, or metadata
-   Read-only data presentation where a full table is not needed

Preview Code

Basic

### User Details

Name

John Doe

Email

john@example.com

Role

Administrator

Status

Active

Preview Code

Bordered

### Order Details

Order ID

#2024-0127

Date

Jan 27, 2025

Status

Shipped

Amount

$249.00

Payment

Visa \*\*\*4242

Tracking

1Z999AA10123456784

Preview Code

Single Column

Product

Lumeo Pro License

Price

$99/year

License Key

XXXX-XXXX-XXXX-XXXX

## API Reference

### Descriptions

Property

Type

Default

Description

Title

string?

null

Heading above the descriptions grid.

Bordered

bool

false

Display with borders and dividers.

Column

int

3

Number of columns (1-4).

ChildContent

RenderFragment?

null

DescriptionsItem children.

### DescriptionsItem

Property

Type

Default

Description

Label

string?

null

Key label text.

ChildContent

RenderFragment?

null

Value content.

Class

string?

null

Additional CSS classes.

## Related Components

-   [Table](/components/table) — Display tabular data with rows and columns for larger datasets
-   [Card](/components/card) — Wrap descriptions in a card for visual grouping