UNPKG

@amsterdam/design-system-css

Version:

Stylesheets for all components from the Amsterdam Design System and some general utilities. Use it to apply the visual design of the City of Amsterdam to your HTML elements or non-React components.

designsystem.amsterdam

Amsterdam/design-system

18 lines (11 loc) • 769 B
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!-- @license CC0-1.0 --> # Icon Button An icon in a button that can be aligned with text. ## Guidelines - Choose an Icon Button instead of a regular Button if it must align with text. Match the size of the Icon Button to that text. - Only [functional icons](https://designsystem.amsterdam/?path=/docs/brand-assets-icons--docs#functional-icons) can be used in an Icon Button. For other icons, use a [Button](https://designsystem.amsterdam/?path=/docs/components-buttons-button--docs) to allow the user to read its label. - Icon Button still needs a label to describe the button to users of screen readers. ## Relevant WCAG requirements The Icon Button follows [the same requirements and guidelines as a regular button](/docs/components-buttons-button--docs).