# Heading

> A section title rendered inside the native heading element matching its semantic depth — `<h1>` through `<h6>` — styled at one fixed emphasis size regardless of which level it renders.

```ts
import { Heading } from "@sdxc/ui";
```

Renders its children inside the native heading element matching `level`,
styled at one fixed emphasis size — semibold, tight-tracked, and colored for
emphasis, with line height collapsed for compact wrapping.

## Examples

```tsx
<Heading level={1}>Page title</Heading>
```

```tsx
<Heading>Section title</Heading>
```

## Props

| Prop | Type | Description |
| --- | --- | --- |
| `level?` | `Level` | Semantic depth. Defaults to the nearest ancestor `HeadingScope`'s depth, or `1` where no scope wraps this heading at all. |

Also accepts everything in `TagProps<"h1">`.