Icon

• Uso
• Desenvolvimento
• Customização

Visão geral

O componente icon é utilizado para dar suporte a compreensão de uma label, de um título e frase. Pode ser usado também para representar um ação ou transmitir uma informação.

note

Nesta primeira onda do componente foi previsto o uso como apoio, decorativo.

Tamanhos

O componente possui três tamanhos diferentes: Small, Medium e Large. O tamanho medium é o tamanho padrão.

Os componentes são formados por tokens, sendo estes propriedades de estilo que definem como será estruturado e estilizado. Os tokens que podem ser alterados pelas marcas, podem ser conferidos na seção de propriedades customizáveis.

Boas práticas

O componente foi projetado para atender os requisitos das Diretrizes de Acessibilidade para Conteúdo Web (WCAG 2.1). Também foi estruturado com base em padrões de usabilidade para contribuir com uma boa experiência. Por isso, ao aplicar esse componente, é muito importante que sejam levados em consideração alguns critérios e práticas:

Cor

• Use o componente Icon na mesma cor da label que o acompanha.

Fazer

O componente icon deve sempre seguir a mesma cor do rótulo ou cor do contexto inserido.

Não fazer

Não use o componente icon em cores diferentes do contexto inserido.