# description-list — Examples

## Stacked (default)

```html
<description-list-ui>
  <dt>Status</dt>
  <dd>Active</dd>
  <dt>Plan</dt>
  <dd>Pro</dd>
  <dt>Renewal</dt>
  <dd>April 14, 2027</dd>
</description-list-ui>
```

## Inline

```html
<description-list-ui layout="inline" align="between">
  <dt>Weight</dt>
  <dd>2.8 lbs</dd>
  <dt>Dimensions</dt>
  <dd>12 × 8 × 1 in</dd>
  <dt>Material</dt>
  <dd>Aluminum</dd>
  <dt>Color</dt>
  <dd>Space gray</dd>
  <dt>Warranty</dt>
  <dd>1 year</dd>
</description-list-ui>
```

## Programmatic

```html
<description-list-ui layout="inline" align="between" items='[{"term":"CPU","description":"Apple M4"},{"term":"RAM","description":"16 GB"},{"term":"Storage","description":"512 GB SSD"}]'></description-list-ui>
```
