5 Códigos CSS para usar em sites no estilo Dark.

👉 Gostaria de receber diretamente em seu WhatsApp tutoriais, dicas e BÔNUS EXCLUSIVOS? Então cadastre-se gratuitamente preenchendo o formulário abaixo!!!

Radial Gradient

CSS 1 - Efeito sutil de brilho no background.

Projeto 1

Site Institucional

Você vai aprender a criar do absoluto zero o tipo de site mais vendido no mercado brasileiro - os sites institucionais.

Projeto disponível para download
				
					
/* Container Esquerdo*/
selector {
    background: radial-gradient(circle at top,#5317A0 -20% ,#120036 70% );
}

/* Container Direto*/
selector {
    background: radial-gradient(circle at bottom,#DBBEFF 0% ,#8E32FF 100% );
    }
				
			

brilho neon

CSS 2 - Elemento com brilho/efeito neon.

Licença elementor pro

Tenha direito a 1 licença do Elementor PRO durante 12 meses p/ usar como quiser.

1 hora de mentoria

Será um momento exclusivo para que eu conhecer você e ajudar na sua jornada.

temas p/ download

Baixe e use os arquivos completos oferecidos no curso e para começar a ganhar dinheiro.

curso de facebook ads

Aprenda a divulgar seus serviços na plataforma mais popular da internet.

curso de tiktok ads

Aprenda a divulgar seus serviços na plataforma que mais vem ganhando espaço na internet.

hora de lançar!!!

Não falta mais nada para que seu caminho se conecte ao sucesso. Aproveite essa oportunidade.

				
					
/* Box feature */
selector:before {
    content: "";
    width: 50px;
    height:4px;
    position: absolute;
    top: -2px;
    left: 25px;
    z-index: 2;
    background-image: linear-gradient(to right,#B5FFF2, #01FFD1);
    box-shadow: 0 0 5px 2px #01FFD175, 0 0 15px 0px #DDFEF85C;
}
				
			

botão Animado

CSS 3 - Botão com efeito de brilho e ícone animado

				
					
/* Botão com background animado*/
selector a.elementor-button {
    animation: animateBg 3s linear infinite;
    background-image: linear-gradient(100deg, #BA84FF, #7508FF, #BA84FF, #7508FF);
    background-size: 300% 100%;
    box-shadow: 0 5px 20px 0px #AC614E6E;
}
@keyframes animateBg {
        0% {
            background-position: 0 0;
            /*transform: scale(1)*/
        }

        50% {
            /*transform: scale(1.08)*/
        }

        100% {
            background-position: 100% 0
        }
    }
				
			

Cantos esfumaçados

CSS 4 - Efeito de cantos escuros

				
					
/* Cantos esfumaçados */
selector {
    mask-image: 
   linear-gradient(to left, transparent 5%, black, transparent 95%);
   -webkit-mask-image: 
   linear-gradient(to left, transparent 5%, black, transparent 95%);
   -moz-mask-image: 
   linear-gradient(to left, transparent 5%, black, transparent 95%);
}
				
			

Background Desfocado

CSS 5 - Efeito de fundo desfocado em containers

invista em tráfego

Não perca mais tempo com ferramentas que não dão resultado. Conheça o melhor caminho para atrair visitantes e converter em clientes

curso de facebook ads

Aprenda a divulgar seus serviços na plataforma mais popular da internet.

curso de tiktok ads

Aprenda a divulgar seus serviços na plataforma mais popular da internet.

				
					
/* Fundo desfocado */
selector {
    backdrop-filter: blur(5px);
}