# Degradê lavanda: códigos de roxo suave

[Canonical HTML page](https://gradiently.design/pt-br/guide/lavender-gradient)

Lavanda é roxo com o volume baixo: calmo, um pouco sonhador, nunca escandaloso. O difícil é mantê-lo suave sem deixar que fique cinza ou açucarado. Estes códigos resolvem as duas coisas.

## The short version

- Um degradê lavanda mistura roxos claros e levemente azulados, muitas vezes com branco, rosado, pêssego ou um azul suave.
- A lavanda fica cinza quando as paradas estão dessaturadas demais, e fica açucarada quando todas as paradas são rosa e violeta pastel.
- Uma parceira quente como pêssego ou amarelo manteiga, ou um verde frio como sálvia, dá personalidade à lavanda.
- Texto branco não fica legível sobre lavanda clara; um ameixa profundo como #2e1065 fica.
- A lavanda combina com bem-estar, sono, casamentos, beleza e produtos digitais tranquilos.

Um **degradê lavanda** mistura roxos claros e suavemente azulados, em geral de quase branco até um lilás delicado ou azul pervinca. Ele transmite calma, leveza e um quê de sonho, e por isso marcas de bem-estar, sono, beleza e casamento adoram. Duas coisas dão errado com ele: tire cor demais e ele vira um cinza empoeirado, coloque rosa demais e ele fica açucarado. Mantenha uma parada com cor nítida, combine com uma parceira quente ou verde e escreva suas palavras em ameixa profundo.

## Lavanda, lilás, pervinca e malva

Os roxos suaves têm vários nomes, e cada um puxa para um lado. Saber qual você quer facilita a mistura: lavanda e pervinca puxam para o azul, lilás e malva puxam para o rosa.

- Névoa lavanda: #f5f3ff
- Lavanda: #e6e0f8
- Violeta suave: #ddd6fe
- Lilás: #c4b5fd
- Pervinca: #c7d2fe
- Orquídea: #d8b4e2
- Malva: #b497bd
- Tinta ameixa: #2e1065

A família dos roxos suaves e um ameixa profundo para o texto. Lavanda e pervinca são mais frias; orquídea e malva são mais quentes.

## Degradês lavanda claros

Estes são os discretos, os mais próximos do branco, para fundos que levam muito texto: o cardápio de uma casa de chá, uma newsletter, as telas de boas-vindas de um app. Eles quase não aparecem, então use onde o conteúdo é o que importa.

- Névoa lavanda: `linear-gradient(180deg, #faf9ff 0%, #e6e0f8 100%)`
- Violeta suave: `linear-gradient(135deg, #f5f3ff 0%, #ddd6fe 100%)`
- Véu pervinca: `linear-gradient(135deg, #eef2ff 0%, #e6e0f8 50%, #f5f3ff 100%)`
- Luz lilás: `radial-gradient(circle at 70% 25%, #ddd6fe 0%, #f5f3ff 55%, #ffffff 100%)`

Lavandas quase brancas. Cada uma mantém uma parada com cor de verdade para nunca parecer cinza.

## Degradês lilás e pervinca

Um passo mais fundo, a lavanda vira uma cor de verdade em vez de um tom. Lilás para pervinca dá uma mistura fria e moderna que fica ótima na tela do celular; lilás para orquídea é mais quente e romântico. Mantenha as duas pontas com luminosidade parecida e a mistura continua suave.

- Lilás para pervinca: `linear-gradient(135deg, #c4b5fd 0%, #a5b4fc 100%)`
- Lilás para orquídea: `linear-gradient(135deg, #ddd6fe 0%, #d8b4e2 100%)`
- Lilás crepúsculo: `linear-gradient(160deg, #e0e7ff 0%, #c4b5fd 50%, #a78bfa 100%)`
- Azul bebê para lilás: `linear-gradient(90deg, #bfdbfe 0%, #c4b5fd 100%)`

Lavandas médias. As que puxam para o azul parecem digitais e calmas; as que puxam para o rosa parecem românticas.

## Lavanda com pêssego, manteiga ou sálvia

Sozinha, a lavanda pode parecer doce demais. Uma parceira de fora da família dos roxos resolve isso. Pêssego e amarelo manteiga trazem calor e fazem a lavanda lembrar a luz do começo da noite. Sálvia traz algo adulto e botânico, e é por isso que lavanda com sálvia é uma combinação tão popular em casamentos. Nesses tons claros, cores opostas se misturam sem embarrar, porque há pouca saturação a perder. [Degradês pastel](https://gradiently.design/pt-br/guide/pastel-gradients) explica esse princípio no círculo cromático inteiro.

- Lavanda e pêssego: `linear-gradient(135deg, #ddd6fe 0%, #fde2cf 100%)`
- Lavanda e manteiga: `linear-gradient(135deg, #e6e0f8 0%, #fef3c7 100%)`
- Lavanda e sálvia: `linear-gradient(135deg, #e6e0f8 0%, #dbe5d4 100%)`
- Céu de fim de tarde: `linear-gradient(180deg, #c7d2fe 0%, #ddd6fe 45%, #fbcfe8 100%)`

Lavanda com uma parceira. Cada uma parece menos doce e mais um lugar ou uma hora do dia de verdade.

## Degradês lavanda crepusculares

Levar a lavanda até o violeta ou o ameixa cria um crepúsculo: ainda suave no alto, intenso embaixo. Eles funcionam para apps de sono, marcas de velas, ioga noturna, perfumes e livrarias. A ponta escura também dá ao texto branco um lugar para ficar. Para a gama completa de roxos mais fortes, veja [degradês roxos](https://gradiently.design/pt-br/guide/purple-gradient).

- Crepúsculo: `linear-gradient(180deg, #e6e0f8 0%, #a78bfa 50%, #4c1d95 100%)`
- Hora de dormir: `linear-gradient(180deg, #ddd6fe 0%, #8b5cf6 55%, #2e1065 100%)`
- Crepúsculo malva: `radial-gradient(circle at 50% 20%, #ede9fe 0%, #b497bd 40%, #4a2e5c 100%)`

Lavanda em cima, ameixa embaixo. Coloque os títulos na metade de baixo em branco, ou na metade de cima em ameixa.

## Ideias com degradê lavanda para postar esta semana

A lavanda costuma ser escolhida porque é agradável e depois usada sem plano nenhum. Estas são peças específicas em que ela realmente ajuda:

- **Um app de sono ou meditação:** “Hora de dormir” como fundo das telas de boas-vindas, texto ameixa no alto e o botão na área violeta escura.
- **O post de Dia das Mães de uma floricultura em 1080×1350:** “Lavanda e pêssego” com uma linha só, “Pedidos até quinta.”
- **Um lançamento de skincare:** “Névoa lavanda” atrás das fotos do produto, para que a embalagem leve a cor.
- **O banner do LinkedIn de uma terapeuta ou coach em 1584×396:** “Véu pervinca” passa calma e profissionalismo sem a frieza do azul corporativo.
- **A tabela de preços de um spa em pôster A4:** “Lavanda e sálvia” com texto berinjela, legível do outro lado da recepção.

## Como evitar a lavanda cinza ou açucarada

### Fica cinza ou açucarada

- Todas as paradas dessaturadas, como `#e2e0e6`
- Lavanda ao lado de cinza frio
- Lavanda, rosa bebê e violeta ao mesmo tempo
- Texto branco sobre lilás claro

### Continua suave e nítida

- Pelo menos uma parada com cor nítida, como `#c4b5fd`
- Lavanda ao lado de branco quente ou creme
- Uma parceira só: pêssego, manteiga ou sálvia
- Texto ameixa profundo nas áreas claras

Um teste útil: coloque uma amostra de cinza puro ao lado da sua lavanda. Se for difícil diferenciar as duas num relance, aumente a cor um pouco. Confira também no celular com o brilho baixo, onde tons muito claros se perdem com facilidade.

## Texto sobre um degradê lavanda

A lavanda é muito clara, então texto branco falha em quase toda ela: branco sobre lilás `#c4b5fd` fica abaixo de 2 para 1. Ameixa profundo `#2e1065` sobre o mesmo lilás passa de 8 para 1 e mantém o texto dentro da família dos roxos, sem a dureza do preto. Para um visual mais suave nas lavandas mais claras, um berinjela discreto como `#3b2f4a` ainda passa com folga. [Contraste de cores e acessibilidade](https://gradiently.design/pt-br/guide/color-contrast-accessibility) tem os detalhes.

Um convite de casamento save the date com texto ameixa profundo sobre um degradê lavanda claro e pêssego

Um convite de 5×7 polegadas a 300 dpi, em lavanda clara com texto ameixa.

O mesmo save the date como um story vertical de celular sobre o degradê lavanda

O mesmo design como story para compartilhar a notícia, renderizado no próprio tamanho.

Com o Pro, o Gradiently leva esse único design da impressão para todos os tamanhos de redes sociais em um passo: o Mark é renderizado do zero em cada formato, e a tinta automática escolhe texto claro ou escuro por linha a partir da paleta do próprio Mark. Para saber mais sobre papelaria, veja [paletas de cores para casamento](https://gradiently.design/pt-br/guide/wedding-color-palettes).

## CSS de degradê lavanda

Por padrão, os navegadores misturam as cores do degradê em sRGB, o que pode apagar o meio de uma mistura entre dois matizes. Interpolar em OKLCH mantém o ponto médio limpo, e um fallback em hex cobre os navegadores sem suporte. Veja [degradês CSS em OKLCH](https://gradiently.design/pt-br/guide/css-gradient-oklch) para saber o suporte.

```css
.card-lavender {
  background: linear-gradient(135deg, #f5f3ff, #ddd6fe, #fde2cf);
  color: #2e1065;
}

@supports (background: linear-gradient(in oklch, red, blue)) {
  .card-lavender {
    background: linear-gradient(in oklch 135deg, #f5f3ff, #ddd6fe, #fde2cf);
  }
}
```

Névoa lavanda para violeta suave para pêssego, com texto ameixa. A versão em OKLCH mantém a mistura luminosa no meio.

## FAQ

### Qual é o código hex da lavanda?

A cor nomeada `lavender` do CSS é `#e6e6fa`, um roxo azulado muito claro. Muitos designers usam versões um pouco mais ricas, como `#e6e0f8` ou `#ddd6fe`.

### Quais cores combinam com um degradê lavanda?

Pêssego, amarelo manteiga, verde sálvia, creme e azul suave. Um ameixa profundo funciona bem para o texto.

### Por que meu degradê lavanda parece cinza?

As paradas estão dessaturadas demais ou ficam ao lado de um cinza frio. Dê cor nítida a pelo menos uma parada e combine com branco quente em vez de cinza.

### Qual é a diferença entre lavanda e lilás?

A lavanda puxa levemente para o azul e costuma ser mais clara; o lilás puxa levemente para o rosa e é um pouco mais forte.

### Qual cor de texto usar sobre lavanda?

Ameixa profundo ou berinjela, como `#2e1065`. Texto branco não passa no contraste sobre lavanda clara.