# Glyph art — Detent

> Hand it an SVG icon or a word and it draws it in shimmering characters, lit from the top left. Switch the shape and the characters re-form into the new one. Move over it and they light up; press for a ripple.

Canonical: https://detentui.com/components/glyph
Last updated: 2026-11-10

## About

Hand it an SVG icon or a word and it draws it in shimmering characters, lit from the top left. Switch the shape and the characters re-form into the new one. Move over it and they light up; press for a ripple.

## Details

- It fills its parent and sizes its characters to the space, so it reads the same on a phone and a wide screen.
- Pass any 24×24 icon path through `shape`, from simple-icons or your own set, or a word.
- It takes your text colour and your `--accent`, so it follows light and dark on its own.
- It assembles the first time it comes into view and pauses off screen and in hidden tabs.
- With reduced motion it shows the finished shape and holds still. Give it a `label` and screen readers hear it as an image.

## Install

```bash
npx shadcn add https://detentui.com/r/glyph
```

## Related
- [All components](https://detentui.com/components)
- [Pro](https://detentui.com/pro)