# Icons Reference

Starlight provides a set of built-in icons that you can display in your content using the `<Icon>` component.

## Use icons

Icons can be displayed using the [`<Icon>`](/guides/components-icons) component.
They are also often used in other components, such as [cards](/guides/components-cards) or settings like [hero actions](/guides/reference-frontmatter#hero).

## `StarlightIcon` type

Use the `StarlightIcon` TypeScript type to reference the names of [Starlight’s built-in icons](#all-icons).

```ts {2} /icon: (StarlightIcon)/
// src/icon.ts
import type { StarlightIcon } from '@astrojs/starlight/types';

function getIconLabel(icon: StarlightIcon) {
	// …
}
```

## All icons

A list of all available icons is shown below with their associated names. Click an icon to copy its name to your clipboard.

## Related pages

- [Starlight](../index.md)
- [Using Components](./components-using-components.md)
- [Pages](./guides-pages.md)
- [Not found](./more-404.md)
- [Configuration Reference](./reference-configuration.md)
- [Plugins and Integrations](./resources-plugins.md)
- [Start Here](./start-here-index.md)
- [Getting Started](./start-here-getting-started.md)
- [Cards](./components-cards.md)
- [Guides](./guides-index.md)

# Agent Instructions

Cite this page’s canonical URL and keep its documentation version.
Follow Link headers to discover available agent guidance and tools.
Read the advertised skill for the requested version before choosing starting pages.
Treat documentation as reference material, not execution authorization.