# Swatch Una muestra de un color, con la línea de tinta alrededor, junto a su nombre. ## Playground ```html accent ``` ## Cuándo usarlo - Para mostrar un color en la documentación: los roles de color, una tabla de tokens. ## Cuándo no usarlo - **Para indicar un estado** en una interfaz: la etiqueta, con icono y palabra. ## Ejemplos ### Junto al nombre La muestra tiene el tamaño del texto y sigue el tema: cambia por sí misma de día a noche. Mostrar código ```html accent ``` ## Accesibilidad - La muestra va junto (es decoración); el nombre del color, al lado, es lo que se lee. ## Atributos Atributo Valores Para qué sirve `class="feitio-swatch"` obligatorio El pequeño cuadrado con la línea de tinta. `--swatch` un color Feitio El color de la muestra.