# Minimal centered text brand

> Four centred figures between two rules on the brand colour.

URL: https://apogee.avaui.dev/docs/metrics-sections/minimal-centered-text-brand
Last updated: 2026-10-20

Four centred figures between two rules on the brand colour.

Last updated October 20, 2026

Live example: https://apogee.avaui.dev/examples/metrics/minimal-centered-text-brand

```astro
---
/**
 * Minimal centered text brand: Four centred figures between two rules on the brand colour.
 *
 * @block metrics
 * @order 6
 */
import Section from '@/components/apogee/Section/Section.astro'
import type { MetricsContent } from '@/components/apogee/sections/_shared/metrics.ts'

/** @composable */
interface Props extends MetricsContent {}

const {
  label = 'Key figures',
  items = [
    { value: '400+', label: 'Projects completed' },
    { value: '600%', label: 'Return on investment' },
    { value: '10k', label: 'Global downloads' },
    { value: '200+', label: 'Five-star reviews' },
  ],
} = Astro.props
---

<Section spacing="large" background="primary">
  <dl aria-label={label} class="grid gap-x-4 gap-y-8 md:grid-cols-2 md:border-y md:py-16 lg:grid-cols-4 border-current/25">
    {items.map((s) => (
      <div class="flex flex-col gap-3 items-center text-center">
        <dt class="order-2 text-lg font-semibold">{s.label}</dt>
        <dd class="order-1 text-5xl font-semibold tracking-tight tabular-nums md:text-6xl ">{s.value}</dd>
      </div>
    ))}
  </dl>
</Section>
```

## Add

```sh
npx @ava-ui/apogee add metrics/minimal-centered-text-brand
```

This copies the block to `src/components/apogee/blocks/metrics/` with everything it uses: Section. Every piece of copy is a prop, with the sample copy as its default. Pass yours, or `null` to hide a part; see [copy is props](https://apogee.avaui.dev/docs/metrics-sections#copy-is-props).

## Accessibility

## Related

[

SectionHeaderEyebrow, heading and description at the top of a section or an app page, with actions, a divider and the level, alignment and colours every section shares.

](https://apogee.avaui.dev/docs/section-header)[

Featured iconAn icon in a tinted tile, the glyph that leads an empty state, an alert, a stat or a feature card.

](https://apogee.avaui.dev/docs/featured-icon)[

StatsHeadline numbers in a row or as cards.

](https://apogee.avaui.dev/docs/sections/stats)