[Soluções] Scroll barra personalizado
[Soluções] Scroll barra personalizado Aplique esse código CSS diretamente nas configurações da Página Código CSS Copiar Código body::-webkit-scrollbar { width: 12px; /* largura total da barra de rolagem */ } body::-webkit-scrollbar-track { background: #090909; /* cor do trilho (fundo da barra) */ } body::-webkit-scrollbar-thumb { background-image: linear-gradient(0deg, #FAFAFA, #00FF73); /* cor/gradiente da barrinha */ border-radius: 20px; /* arredondamento da barrinha */ border: 3px solid #090909; /* cria um “espaço” entre a barrinha e o trilho */ }
[Soluções] Tirar bg do HTML
[Soluções] Tirar bg do HTML Aplique esse CSS Dentro do Widget de HTML para tirar aquela cor cinza do BG Do Widget Código CSS Copiar Código .elementor-widget-html{ background: transparent !important }
[Soluções] Scroll Horizontal
[Soluções] Scroll Horizontal Esse código é para solucionar aquele espaçamento Chato que o Elementor gera nos Widget de Editor de Texto Basta colocar esse código no CSS em um único widget ou da página (não precisa estar em todos) Código CSS Copiar Código html, body{ overflow-x: hidden !important; }
[Soluções] Correção espaçamento Widget Texto
[Soluções] Correção espaçamento Widget Texto Esse código é para solucionar aquele espaçamento Chato que o Elementor gera nos Widget de Editor de Texto Basta colocar esse código no CSS em um único widget ou da página (não precisa estar em todos) Código CSS Copiar Código p:last-child{ margin-bottom:0px; } .elementor-widget-text-editor p:last-child{ margin-bottom:0px; margin-top:0px; }
[Titulo] Degrade Animado
[Titulo] Degrade Animado Adicione um Widget de Título no Elementor Não precisa definir classe CSS Aplique esse código CSS no Elemento (Avançado/Custom CSS) Código CSS Copiar Código selector .elementor-heading-title { /* transições suaves */ transition: all 1s; /* deixa o texto transparente para mostrar o gradiente */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; /* animação do movimento do gradiente */ animation: move 3s ease 1s infinite alternate; /* gradiente animado entre branco e verde */ background-image: linear-gradient(45deg, #FAFAFA, #00FF73, #FAFAFA, #00FF73); background-size: 500% 200%; } @keyframes move { 0% { background-position: 0 0; } 100% { background-position: 100% 0; } }
[Titulo] Degrade Solido Fundo
[Titulo] Degrade Solido Fundo Adicione um Widget de Título no Elementor Defina a classe CSS no titulo: destaque Aplique esse código CSS no Elemento (Avançado/Custom CSS) Código CSS Copiar Código .destaque { /* fundo do destaque */ background: linear-gradient(to right, #7300B5 70%, transparent); padding: 10px 20px; width: fit-content; margin-top: 20px; margin-bottom: 20px; position: relative; /* faixa lateral */ border-left: 5px solid #E95BFF; } /* seta removida completamente */ .destaque::after { content: none !important; }
[Titulo] Degrade separado
[Titulo] Degrade separado Adicione um Widget de Título no Elementor Não precisa definir Classe Aplique esse código CSS no Elemento (Avançado/Custom CSS) Código CSS Copiar Código .degrade { /* degradê aplicado no texto — ajuste aqui se quiser outra variação */ background-image: linear-gradient(to left, #00FF73 0%, #00CC5E 100%); background-clip: text; -webkit-background-clip: text; /* deixa o texto transparente para revelar o degradê */ text-fill-color: transparent; -webkit-text-fill-color: transparent; } Coloque palavra que deseja o degrade entre as tags como no exemplo:
[Titulo] Degrade Total
[Titulo] Degrade Total Adicione um Widget de Título no Elementor Não precisa definir Classe Aplique esse código CSS no Elemento (Avançado/Custom CSS) Código CSS Copiar Código selector { /* degradê aplicado diretamente no texto */ background-image: linear-gradient(to left, #00FF73 0%, #09A654 100%); /* ajuste as cores aqui */ background-clip: text; -webkit-background-clip: text; /* deixa o texto transparente para revelar o degradê */ text-fill-color: transparent; -webkit-text-fill-color: transparent; }
[Titulo] Risco/Corte no Texto
[Titulo] Risco/Corte no Texto Adicione um Widget de Título no Elementor Não precisa definir Classe Aplique esse código CSS no Elemento (Avançado/Custom CSS) Código CSS Copiar Código .risco { text-decoration-line: line-through; -webkit-text-decoration-line: line-through; /* cor do risco — ajuste aqui se quiser outra tonalidade */ text-decoration-color: #FF3B3B; -webkit-text-decoration-color: #FF3B3B; } Coloque palavra que deseja riscar entre as tags como no exemplo:
[Titulo] Blur centro a fora
[Titulo] Blur centro a fora Adicione um Widget de Título no Elementor Não precisa definir Classe Aplique esse código CSS no Elemento (Avançado/Custom CSS) Código CSS Copiar Código selector { /* tempo e curva da animação do texto */ -webkit-animation: texto 1.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; animation: texto 1.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both; } @-webkit-keyframes texto { 0% { /* espaçamento reduzido para iniciar comprimido */ letter-spacing: -0.5em; /* intensidade do desfoque inicial */ -webkit-filter: blur(12px); filter: blur(12px); opacity: 0; } 100% { /* texto nítido no final */ -webkit-filter: blur(0); filter: blur(0); opacity: 1; } }