Padrão de URL
https://cdn.biglink.io/brand/v1/icones/tabler/<estilo>/svg/<cor>/<nome>.svg https://cdn.biglink.io/brand/v1/icones/tabler/<estilo>/png/<cor>/<tamanho>/<nome>.png estilo: outline (5.130) | filled (1.054) cor: rich-black | bangladesh | mountain | stone | caribbean | white | off-white currentcolor, so em SVG, herda a cor do CSS tamanho: 32 | 128
Os nomes estão no catálogo em Ícones, com busca e filtro por categoria. Nome que não está lá não existe.
O estilo precisa estar na URL
Os 1.054 preenchidos têm exatamente os mesmos nomes dos 5.130 contornos: heart existe nos dois. Por isso outline e filled são segmentos do caminho, e não sufixo do nome. Esquecer o segmento dá 404, não dá o outro estilo.
As marcas ficam em brand-
Redes sociais e logotipos de terceiros estão na categoria Brand, com o prefixo no nome: brand-linkedin, brand-instagram, brand-whatsapp. São 376 no total.
O acervo Feather está congelado
/brand/v1/icones/svg/ e /png/ continuam no ar com os 288 ícones antigos, e continuam assim para sempre: comunicado já enviado aponta para lá, com cache de um ano. Não use em peça nova. E cuidado com os nomes que mudaram: globe virou world, check-circle virou circle-check, zap virou bolt.
Na web, use o currentcolor
É uma cópia só, e a cor vem do CSS. As pastas por cor existem para quando você não consegue controlar o CSS, como em e-mail, documento e apresentação.
As quatro formas de usar
<!-- 1. SVG embutido: a cor segue o texto do elemento --> <span style="color: var(--bl-bangladesh)"> <!-- cole aqui icones/tabler/outline/svg/currentcolor/check.svg --> </span> <!-- 2. imagem por URL: a cor esta no arquivo, escolha a pasta certa --> <img src="https://cdn.biglink.io/brand/v1/icones/tabler/outline/svg/bangladesh/check.svg" width="24" height="24" alt=""> <!-- 3. PNG, para e-mail e para quem nao renderiza SVG --> <img src="https://cdn.biglink.io/brand/v1/icones/tabler/outline/png/white/32/check.png" width="16" height="16" alt=""> /* 4. mascara CSS: um arquivo so, qualquer cor, sem SVG embutido */ .icone{ width:24px; height:24px; background: var(--bl-bangladesh); -webkit-mask: url(https://cdn.biglink.io/brand/v1/icones/tabler/outline/svg/currentcolor/check.svg) center/contain no-repeat; mask: url(https://cdn.biglink.io/brand/v1/icones/tabler/outline/svg/currentcolor/check.svg) center/contain no-repeat; }
Em e-mail, PNG e sempre o dobro
Outlook para desktop não renderiza SVG. Use PNG, e pegue o de 32 para exibir em 16, ou o de 128 para exibir em 64: o arquivo maior mantém o traço nítido em tela retina. Sempre com width, height e border:0 no atributo style.
Sobre o conjunto
São 6.184 ícones do Tabler, de Paweł Kuna, sob licença MIT, em 41 categorias, normalizados para traço 1,75. A licença acompanha os arquivos em /brand/v1/icones/tabler/LICENCA-TABLER.txt.
Com esse tamanho de acervo, é raro faltar. Se faltar mesmo, fale com a Segurança e Tecnologia antes de trazer um de fora: um traço diferente no meio dos outros salta aos olhos.