Recursos gratuitos para você utilizar em seu frontend

Neste artigo eu mostro sites com vários recursos gratuitos para você utilizar em seu frontend. Você vai ver sites com geradores de CSS, paletas de cores e banco de imagens

GERADORES DE CSS

Precisa de ajuda para criar um efeito em CSS? Seus problemas acabaram!

Best CSS Button Generator
https://www.bestcssbuttongenerator.com
O mais completo gerador de botões que você já viu

CSS Generator
https://html-css-js.com/css/generator/
Gerador de CSS com vários exemplos prontos de efeitos para tabelas, texto, bordas e backgrouds, além de outros recursos

Fancy Border Radius
https://9elements.github.io/fancy-border-radius
Permite criar elementos com borda irregular utilizando um editor onde você arrasta as bordas até chegar no formato desejado

Hamburgers
https://jonsuh.com/hamburgers/
Animações para menu hamburguer.

Hover
https://ianlunn.github.io/Hover/
Uma coleção de efeitos hover para aplicar em links, botões ou imagens.

Magic Animation
https://www.minimamente.com/project/magic/
Magic Animation possui 12 categorias de efeitos de animação

Neumorphism
https://neumorphism.io
Cria cartões arredondados com sombras

Shape Dividers
https://shapedividers.com
Este site cria divisores de formas verticais, responsivos, e animados. Os divisores são feitos em SVG

UI Universe
https://uiverse.io
Botões, checkboxes, cartões, loaders... dezenas de elementos de interface prontos para uso

Wait! Animate
https://waitanimate.wstone.io
O Wait! animate é um site que cria animações utilizando apenas CSS

PALETAS DE CORES

Se achar a combinação de cores ideais para seu site é um problema estes sites tem a solução!

Adobe Color
https://color.adobe.com/pt/create/color-wheel/

Color Hunt
https://colorhunt.co/

Coolors
https://coolors.co/

Couleur
https://couleur.io

Happy Hues
https://www.happyhues.co/

Flat UI Colors
https://flatuicolors.com/

Grabient
https://www.grabient.com/

Gradient Hunt
https://gradienthunt.com/

Paletton
https://paletton.com/

Pigment
https://pigment.shapefactory.co/

WebGradient
https://webgradients.com/

IMAGENS

Se você está com dificuldades para encontrar imagens para seus projetos considere as seguintes sugestões.

404 Illustrations (by kapwing)
https://www.kapwing.com/404-illustrations/

404 Illustrations
https://error404.fun/

DrawKit
https://www.drawkit.io/

Delesing
https://delesign.com/free-designs/graphics/

Humaaans
https://www.humaaans.com/

Ouch
https://icons8.com.br/illustrations/

Open Doodle
https://www.opendoodles.com/

Pexels
https://www.pexels.com/pt-br/

Storyset
https://storyset.com/

unDraw
https://undraw.co/

NÃO DEIXE DE CONHECER

Outros sites que podem ser de seu interesse...

Can I Use?
https://caniuse.com
Verifica a compatibilidade de recursos com diferentes versões de navegadores

Dev Hints
https://devhints.io
Possui lista de comandos em várias linguagens

One Page Love
https://onepagelove.com/templates/free-templates
Templates gratuitos e pagos para quem quer criar um site de apenas uma página

UI Deck
https://uideck.com
Modelos de landing pages gratuitas, temas de bootstrap, modelos de React, modelos de Tailwind, modelos de site HTML, e kits de interface de usúario