Fundo em gradiente
O fundo é a cor ou gradiente que preenche toda a página, atrás de todos os elementos. O Bio Link vem com 8 fundos pré-definidos, mas você também pode criar um gradiente personalizado com 3 cores à sua escolha.
Os 8 fundos pré-definidos
| Fundo | Visual | Combina com |
|---|---|---|
| Escuro | Cinza quase preto | Cores vibrantes, visual moderno |
| Claro | Branco | Visual clean, minimalista |
| Suave | Cinza → roxo suave | Cor violeta principal |
| Pôr do Sol | Laranja → rosa → roxo | Cores quentes (laranja, rosa, vermelho) |
| Oceano | Ciano → azul → índigo | Cor azul principal |
| Floresta | Verde → esmeralda → teal | Cor verde principal |
| Aurora | Roxo → rosa → ciano | Visual criativo, qualquer cor principal |
| Meia-noite | Ardósia → roxo escuro | Visual sofisticado, cores claras |
Para escolher um deles, basta clicar no card correspondente na aba Aparência → seção Fundo.
Criando um gradiente personalizado
Se nenhum dos pré-definidos combina com sua marca, crie o seu.
Passo 1: Selecione “Custom”
Na seção Fundo da aba Aparência, clique no card Custom (último card, com ícone tracejado).
Passo 2: Escolha as 3 cores
Aparecem três color pickers:
- Início — cor do canto superior esquerdo
- Meio — cor da transição central
- Fim — cor do canto inferior direito
Cada um aceita qualquer cor do espectro. Você pode usar o color picker visual ou digitar o código hexadecimal direto.
Passo 3: Acompanhe o preview
Abaixo dos color pickers, há um preview ao vivo do gradiente sendo montado. Ajuste as cores até chegar no visual que você quer.
Passo 4: Salve
As mudanças são salvas automaticamente. A página pública já reflete o novo gradiente em até 30 segundos.
Sugestões de combinações
Se você está sem ideia, aqui vão combinações testadas e aprovadas:
Para a área de saúde/bem-estar
- Início:
#E0F4FF(azul claro) - Meio:
#B4E0FE(azul médio claro) - Fim:
#7DC5F5(azul mais saturado)
Para negócios criativos
- Início:
#1A0033(roxo quase preto) - Meio:
#5B2C91(roxo médio) - Fim:
#E91E63(rosa vibrante)
Para natureza/sustentabilidade
- Início:
#0F4C3A(verde escuro) - Meio:
#2D8659(verde médio) - Fim:
#8BC34A(verde claro)
Minimalista profissional
- Início:
#F8F9FA(branco-gelo) - Meio:
#E9ECEF(cinza claro) - Fim:
#DEE2E6(cinza médio)
Para um visual coeso, escolha 3 tons da mesma cor (claro, médio, escuro). Para um visual mais ousado, use 3 cores complementares (azul + roxo + rosa, por exemplo).
Depois de criar o gradiente, teste a legibilidade do texto. Se a sua cor principal for muito clara e o gradiente também for claro, o texto vai sumir no fundo. Ajuste a Cor do Texto se necessário.
Quando NÃO usar gradiente custom
- Se você tem muitos links com cores customizadas — vai ficar visualmente bagunçado
- Se você está começando e não tem tempo de testar — escolha um pré-definido (Aurora funciona em 90% dos casos)
- Se você publica conteúdo em que o fundo compete com as imagens dos links — nesse caso, prefira um fundo liso
Próximo assunto
Com o visual pronto, vamos entender como ler e usar os números de Analytics.