Usando ícones de aviso
Triângulos e pontos de exclamação sinalizam avisos e erros; combine o ícone com texto para que o significado não dependa só da cor.
Todos os ícones aqui seguem currentColor, então herdam a cor do texto do elemento onde estão — um único SVG funciona em fundos claros e escuros, em links e em botões. Defina um width e um height explícitos (ou dimensione-os no CSS com 1em) para que o layout não se desloque enquanto a página carrega.
Ícones acessíveis
Se o ícone é decorativo ou fica ao lado de texto visível, adicione aria-hidden="true". Se ele é o único conteúdo de um botão ou link, dê a esse elemento um aria-label como “Aviso”.
Licenças
Estes ícones de aviso vêm de Lucide, Phosphor, Iconoir, Fluent UI, Material Symbols, Material Design Icons e Carbon — bibliotecas open-source sob licenças MIT, ISC ou Apache 2.0, que permitem uso pessoal e comercial. Precisa de outra coisa? Pesquise todos os 70.000+ ícones no SVG Icon Finder.
Buscador de Ícones SVG
Busque 70.000+ ícones SVG open source — Lucide, Tabler, Heroicons, Phosphor, Bootstrap, Material e mais.