Design e Cor guias
Escolha uma ferramenta para ler o guia completo, exemplos e solução de problemas.
Gerador de sombra de caixa CSS — guia, exemplos e perguntas frequentes
Projete visualmente sombras de caixa em camadas e copie CSS pronto para produção.
4 minutos de leituraGerador de gradiente CSS — guia, exemplos e perguntas frequentes
Crie gradientes lineares, radiais e cônicos com múltiplas paradas de cores.
4 minutos de leituraGerador de raio de borda — guia, exemplos e perguntas frequentes
Controle cada canto de forma independente e visualize formas e pílulas orgânicas.
4 minutos de leituraConversor de cores — guia, exemplos e perguntas frequentes
Converta entre HEX, RGB, HSL e HSV com amostras ao vivo e dicas de contraste.
4 minutos de leituraVerificador de contraste WCAG — guia, exemplos e perguntas frequentes
Meça as taxas de contraste do texto e verifique a conformidade AA/AAA para texto normal e grande.
4 minutos de leituraConversor de PX para REM — guia, exemplos e perguntas frequentes
Converta pixels em rem e vice-versa com um tamanho de fonte raiz configurável.
4 minutos de leituraGerador CSS Flexbox — guia, exemplos e perguntas frequentes
Crie layouts flexbox visualmente e copie o CSS.
4 minutos de leituraGerador de grade CSS — guia, exemplos e perguntas frequentes
Crie colunas, linhas e lacunas de grade CSS responsivas visualmente.
4 minutos de leituraGerador de triângulo CSS — guia, exemplos e perguntas frequentes
Crie triângulos CSS em qualquer direção com o truque da borda.
4 minutos de leituraGerador de morfismo de vidro — guia, exemplos e perguntas frequentes
Crie cartões de vidro fosco com desfoque, tonalidade, borda e sombra.
4 minutos de leituraGerador de barra de rolagem personalizada — guia, exemplos e perguntas frequentes
Estilize barras de rolagem com propriedades CSS do WebKit e Firefox.
4 minutos de leituraGerador de animação CSS — guia, exemplos e perguntas frequentes
Crie uma animação de quadro-chave fade-and-slide com tempo configurável.
4 minutos de leituraGerador de tipografia fluida — guia, exemplos e perguntas frequentes
Crie tamanhos de fonte clamp() que sejam dimensionados suavemente entre as viewports.
4 minutos de leituraGerador de filtro CSS — guia, exemplos e perguntas frequentes
Combine filtros de desfoque, brilho, contraste, saturação e matiz visualmente.
4 minutos de leituraGerador de paleta de cores — guia, exemplos e perguntas frequentes
Gere paletas complementares, análogas, triádicas e tetrádicas a partir de uma cor base.
4 minutos de leituraGerador de tonalidade e sombra — guia, exemplos e perguntas frequentes
Crie cinco tonalidades e cinco tonalidades a partir de qualquer cor base.
4 minutos de leituraGerador de ondas SVG — guia, exemplos e perguntas frequentes
Gere caminhos de onda SVG suaves para divisores de seção e planos de fundo.
4 minutos de leituraSandbox de emparelhamento de fontes — guia, exemplos e perguntas frequentes
Visualize pares de fontes de cabeçalho e corpo usando fontes do sistema.
4 minutos de leituraGerador de pilha de fontes do sistema — guia, exemplos e perguntas frequentes
Copie pilhas de fontes do sistema prontas para UI e prosa.
4 minutos de leituraGerador de sombra de texto CSS — guia, exemplos e perguntas frequentes
Projete sombras de texto em camadas e copie o CSS.
4 minutos de leitura