# Degradê verde floresta: códigos profundos e naturais

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

O verde floresta é o mais adulto dos verdes: silencioso, rico e um pouco sério. Estes códigos seguem um bosque de verdade, do chão até a copa, com combinações que evitam que ele fique chapado.

## The short version

- Um degradê verde floresta vai de um verde quase preto, como a sombra sob as árvores, até um verde médio ou claro onde a luz atravessa.
- Verdes puxados para o azul lembram pinheiros e plantas perenes, enquanto verdes puxados para o amarelo lembram musgo e samambaia.
- Um pequeno destaque quente, como creme, latão ou terracota, faz o verde floresta parecer rico em vez de chapado.
- O verde floresta fica barrento quando é misturado direto com vermelho ou laranja, então mantenha as cores quentes como destaques separados.
- Texto claro na ponta escura de um degradê verde floresta lê bem e passa calma e sofisticação.

Um **degradê verde floresta** vai de um verde quase preto, a cor da sombra profunda sob as árvores, até um verde médio mais rico ou um verde suave iluminado pelo sol onde a luz atravessa a copa. Ele passa uma sensação natural, firme e discretamente cara, e por isso marcas tradicionais, empresas de atividades ao ar livre, hotéis e lojas de plantas recorrem a ele. Os códigos abaixo seguem um bosque de verdade, do chão até o alto das árvores, com notas sobre o que combinar com cada um.

## As cores de uma floresta, do chão à copa

Entre num bosque e você vê mais de um verde. A sombra mais profunda é quase preta. Pinheiros e abetos puxam para o azul. Musgo, samambaias e folhas novas puxam para o amarelo. Lá no alto, onde o sol bate nas folhas, o verde fica claro e dourado, e numa manhã úmida tudo se dissolve num verde acinzentado suave. Um bom degradê floresta escolhe uma dessas histórias, não todas.

- Pinho noturno: #0b1f14
- Floresta: #14391f
- Copa: #22573a
- Abeto: #1d4a3f
- Musgo: #4f6b2a
- Samambaia ao sol: #a7c97a
- Névoa da manhã: #c9d3cc
- Sol entre as folhas: #f3d98b

Verdes de bosque. O abeto puxa para o azul, o musgo para o amarelo, e o ponto de luz do sol é a única cor quente de que você precisa.

## Códigos de degradê verde floresta

Comece pela copa profunda se você quer o clássico **degradê verde escuro**: é o mais versátil e sustenta muito bem texto claro. O pinho é mais frio e mais moderno. O musgo é mais terroso e funciona para comida, artesanato e tudo o que é feito à mão. A samambaia ao sol é o mais claro do conjunto e continua sendo floresta, não verde-limão.

- Copa profunda: `linear-gradient(160deg, #0b1f14 0%, #14391f 45%, #22573a 100%)`
- Pinho e abeto: `linear-gradient(180deg, #0e2a26 0%, #1d4a3f 50%, #3c6e5d 100%)`
- Musgo: `linear-gradient(135deg, #2f3d17 0%, #4f6b2a 50%, #8a9a4b 100%)`
- Samambaia ao sol: `linear-gradient(180deg, #1f4d2b 0%, #3f7d3c 55%, #a7c97a 100%)`

Quatro verdes floresta. Cada um mantém o matiz estável e muda principalmente na luminosidade, e é isso que deixa a mistura limpa.

Para verdes mais frescos e vivos, do esmeralda ao limão, a coleção principal de [degradê verde](https://gradiently.design/pt-br/guide/green-gradient) vai mais longe. Se você quer um verde floresta com mais azul, o [degradê azul-petróleo](https://gradiently.design/pt-br/guide/teal-gradient) continua de onde o pinho para.

## Névoa, luz do sol e o chão da floresta

A atmosfera é o que faz um degradê floresta parecer um lugar, não uma amostra de tinta. A névoa clareia o topo do quadro num verde acinzentado pálido e deixa as árvores surgirem embaixo. A luz do sol entre a copa é um brilho radial de dourado suave no alto do quadro. O chão da floresta traz um pouco de marrom na base, o que dá peso ao design. Um desses efeitos por design já basta.

- Floresta com névoa: `linear-gradient(180deg, #c9d3cc 0%, #7e968a 45%, #2f4a3d 100%)`
- Sol entre a copa: `radial-gradient(ellipse at 70% 10%, #f3d98b 0%, #8aa64b 25%, #2c5a2f 55%, #0c2215 90%)`
- Chão da floresta: `linear-gradient(0deg, #1a140c 0%, #2e2a16 35%, #2a4a26 100%)`
- Noite perene: `radial-gradient(circle at 50% 30%, #1f4a35 0%, #0d2219 50%, #040b08 100%)`

Degradês floresta com atmosfera. A floresta com névoa aceita texto claro embaixo e escuro em cima; a noite perene aceita branco em qualquer lugar.

## O que combinar com verde floresta

Sozinho, o verde floresta pode parecer pesado. Um único parceiro quente, usado no texto ou num pequeno destaque, muda toda a personalidade dele. Escolha o parceiro pela sensação que você quer e mantenha-o fora do degradê em si.

| Combine com | Hex | Sensação | Combina com |
| --- | --- | --- | --- |
| Creme quente | `#f4efe3` | Tradição, calma | Marcas outdoor, livrarias, cafés |
| Dourado latão | `#c9a24a` | Luxo, clássico | Hotéis, destilados, clubes privados |
| Terracota | `#c8643b` | Terroso, simpático | Lojas de plantas, cerâmica, comida |
| Rosa blush | `#f2c6c2` | Suave, romântico | Floriculturas, casamentos, beleza |
| Sálvia clara | `#d7e2d0` | Fresco, delicado | Bem-estar, skincare, chá |

Um parceiro por vez. Creme e latão são os mais seguros; o blush é a surpresa que faz os feeds de floriculturas se destacarem.

Há mais sobre como montar paletas naturais em [paletas de cores da natureza](https://gradiently.design/pt-br/guide/nature-color-palettes) e [cores terrosas](https://gradiently.design/pt-br/guide/earth-tone-colors), e sobre o que o verde comunica às pessoas em [significado da cor verde](https://gradiently.design/pt-br/guide/green-color-meaning).

## Como manter o verde floresta rico, não chapado

### Fica chapado ou doentio

- Verde misturado direto com vermelho ou laranja
- Um verde amarelado tão vivo que parece limão
- Cinza neutro adicionado para escurecer
- Preto puro na ponta escura
- Texto verde vivo sobre verde escuro

### Parece uma floresta

- Cores quentes mantidas como destaques separados
- Ponta clara mantida suave, como #a7c97a
- Escurecido baixando a luminosidade, mantendo o matiz
- Um quase preto que ainda é verde, como #0b1f14
- Texto creme ou latão sobre verde escuro

O primeiro ponto é o que pega as pessoas. Verde e vermelho ficam em lados opostos do círculo cromático, e uma mistura direta entre eles passa pelo marrom. Se você quer os dois, deixe que se encontrem numa borda nítida, ou mantenha o vermelho no texto. [Degradês barrentos](https://gradiently.design/pt-br/guide/muddy-gradients) mostra exatamente o que acontece no meio.

> **Verdes escuros na impressão** Verdes profundos costumam sair impressos mais escuros e mais opacos do que parecem na tela, e a ponta quase preta pode perder a cor por completo. Para flyers, cardápios e placas, clareie um pouco o ponto mais escuro e peça uma prova antes da tiragem completa. [Degradês na impressão](https://gradiently.design/pt-br/guide/print-gradients) cobre faixas e mudanças de cor no papel.

## Degradês verde floresta em designs reais

O verde floresta é um presente para negócios que trabalham ao ar livre ou com coisas vivas, porque transmite conhecimento e cuidado sem gritar. Um paisagista pode postar lembretes da estação, uma floricultura pode anunciar uma oficina, um hotel pode divulgar um fim de semana fora, e tudo parece da mesma marca.

Um post retrato com fundo verde floresta profundo e o título Visitas de primavera abertas em texto creme

O post retrato de um paisagista. Texto creme na ponta profunda, com o verde mais claro mantido nas bordas.

Essa consistência é a parte difícil quando os posts, stories e flyers de uma estação inteira saem de mãos diferentes. No Gradiently, você escolhe um Mark verde floresta uma vez e todo design no Studio o veste no tamanho certo, com a parte calma mantida atrás das suas palavras. [Marketing para paisagismo](https://gradiently.design/pt-br/guide/landscaping-marketing) tem uma estação de ideias para preencher.

```css
:root {
  --forest-950: #0b1f14;
  --forest-800: #14391f;
  --forest-600: #22573a;
  --forest-300: #a7c97a;
  --cream: #f4efe3;
}

.hero--forest {
  color: var(--cream);
  background: linear-gradient(160deg, var(--forest-950) 0%, var(--forest-800) 45%, var(--forest-600) 100%);
}
```

Verde floresta como tokens reutilizáveis, com creme para o texto. As mesmas variáveis podem colorir botões e bordas em todo o site.

## FAQ

### Qual o código hex do verde floresta?

A cor nomeada do CSS `forestgreen` é `#228b22`, um verde bastante vivo. Verdes floresta mais profundos para degradês ficam entre #14391f e #22573a, com versões quase pretas como #0b1f14 para a ponta escura.

### Quais cores combinam com um degradê verde floresta?

Creme quente, dourado latão, terracota, rosa blush e sálvia clara. Use uma delas como cor de texto ou de destaque, em vez de misturá-la ao verde.

### Por que meu degradê verde parece barrento?

Provavelmente ele está se misturando com vermelho, laranja ou cinza. Mantenha o matiz estável, escureça baixando a luminosidade e deixe as cores quentes encontrarem o verde numa borda nítida ou ficarem no texto.

### Qual cor de texto funciona sobre verde escuro?

Creme como #f4efe3, branco ou um latão suave. Eles leem bem na ponta escura e mantêm a sensação calma e natural.