# Paleta de colores tierra: códigos sólidos para copiar

[Canonical HTML page](https://gradiently.design/es/guide/earth-tone-colors)

Los colores tierra son los del barro, la arena, la corteza, el musgo y la piedra. Transmiten calma, honestidad y calidez, y es sorprendentemente fácil dejarlos planos. Aquí tienes ocho paletas con códigos que siguen vivos.

## The short version

- Una paleta de colores tierra usa los colores apagados de los materiales naturales: marrones, tostados, arena, arcilla, terracota, ocre, oliva, musgo y grises cálidos.
- Los colores tierra transmiten calma, calidez y confianza, por eso abundan en interiorismo, comida, bienestar, aire libre y marcas artesanales.
- Las paletas de colores tierra se ven planas cuando todos los colores tienen la misma luminosidad, así que incluye un fondo pálido, un tono medio y un marrón u oliva muy oscuro.
- Un único acento más vivo, como naranja quemado, ocre o verde azulado profundo, evita que una paleta terrosa resulte apagada.
- El marrón espresso oscuro o corteza es el color de texto más fiable sobre colores tierra claros, y el crema cálido se lee bien sobre los oscuros.

Una **paleta de colores tierra** se construye con los colores cálidos y apagados de los materiales naturales: arena `#e7d8c3`, arcilla `#c2703d`, siena `#a0522d`, oliva `#6b7046`, corteza `#3d2b1f` y los cremas, ocres y grises que los rodean. Estos colores transmiten calma y honestidad porque los vemos en la tierra, la piedra, la madera y la hierba seca. El truco es el rango. Una buena paleta terrosa siempre incluye un fondo pálido, uno o dos tonos medios y un oscuro profundo; si no, se convierte en una única mancha beige. Abajo tienes ocho paletas con códigos que puedes copiar.

## Qué se considera un color tierra

Los colores tierra tienen menos saturación que los del círculo cromático estándar y se sitúan sobre todo en la mitad cálida: rojos vueltos óxido, naranjas vueltos arcilla, amarillos vueltos ocre, verdes vueltos oliva y salvia. Muchos llevan el nombre de pigmentos reales, como la siena y la sombra, que originalmente se hacían con tierra de colores.

| Color | Hex | Se encuentra en | Sensación |
| --- | --- | --- | --- |
| Arena | `#e7d8c3` | Playas, yeso, lino | Ligero, calmado |
| Ocre | `#c8963e` | Pigmento de arcilla, hierba seca | Soleado, envejecido |
| Terracota | `#c2703d` | Barro cocido, tejas | Cálido, artesanal |
| Siena | `#a0522d` | Suelo rico en hierro | Rico, terroso |
| Oliva | `#6b7046` | Hojas de olivo, líquenes | Con los pies en la tierra, maduro |
| Salvia | `#9caf88` | Hierbas secas | Suave, sosegado |
| Piedra | `#a8a196` | Granito, pizarra | Callado, neutro |
| Corteza | `#3d2b1f` | Corteza de árbol, café | Sólido, fiable |

Ocho colores tierra básicos. La mayoría de las paletas de abajo se construyen con tres a cinco de ellos.

## Ocho paletas de colores tierra

Cada paleta enumera los colores del más claro al más oscuro. Usa el primero como fondo, los intermedios para formas e imágenes y el último para el texto.

- Hueso: #f3ece2
- Duna: #e0c3a3
- Terracota: #c2703d
- Óxido: #8b4a2b
- Corteza: #3d2b1f

**Arcilla del desierto.** Cálida y soleada. Va con cerámica, interiores y viajes.

- Salvia pálida: #eef0e5
- Salvia: #9caf88
- Oliva: #6b7046
- Musgo: #4a4a2f
- Tinta bosque: #1f2416

**Olivar.** Inclinada al verde y sosegada. Va con bienestar, comida y jardinería.

- Concha: #f5efe6
- Arena: #e7d8c3
- Madera de deriva: #a8a196
- Piedra marina: #5f6b6d
- Pizarra: #2e3335

**Arena de costa.** Más fría y aireada. Va con hoteles, cuidado de la piel y arquitectura.

- Paja: #f1e4c8
- Ocre: #c8963e
- Siena: #a0522d
- Sombra: #6b3e26
- Espresso: #2b1d14

**Cosecha de otoño.** Rica y dorada. Va con panaderías, café y campañas de temporada.

- Papel de arroz: #ece6dc
- Avena: #c9bba5
- Topo: #8c7b67
- Nogal: #5b5246
- Carbón: #262320

**Neutro callado.** Casi sin color, muy calmado. Va con interiores Japandi, mobiliario y maquetaciones editoriales.

- Arcilla rubor: #f4e9df
- Adobe: #d9a38a
- Ladrillo: #b4644a
- Óxido: #7a3b2e
- Cacao: #3a1f19

**Taller de terracota.** Inclinada al rosa y suave. Va con floristerías, velas y marcas boho.

- Neblina: #d8cfc0
- Liquen: #6b6250
- Turba: #4a3b2c
- Suelo: #2a2119
- Tierra de noche: #14100c

**Tierra oscura.** Sombría y premium. Va con whisky, cuero, equipamiento de exterior y moda masculina.

- Hueso: #f3ece2
- Camello: #d9c3a5
- Oliva: #6b7046
- Verde azulado profundo: #2f5d62
- Corteza: #3d2b1f

**Tierra con acento.** Un verde azulado profundo eleva todo el conjunto sin romper el ambiente.

## Cómo equilibrar una paleta de colores tierra

Los colores tierra comparten una saturación baja, así que la luminosidad tiene que hacer el trabajo que suele hacer la saturación. Si todos tus colores son tonos medios, el diseño se ve plano y turbio. Repártelos entre claro, medio y oscuro, y luego asígnalos con la [regla 60 30 10](https://gradiently.design/es/guide/60-30-10-rule).

| Papel | Proporción | Ejemplo de arcilla del desierto |
| --- | --- | --- |
| Fondo | Cerca del 60% | Hueso `#f3ece2` |
| Apoyo | Cerca del 30% | Duna `#e0c3a3` y Óxido `#8b4a2b` |
| Acento | Cerca del 10% | Terracota `#c2703d` |
| Texto | Según haga falta | Corteza `#3d2b1f` |

Una paleta asignada a papeles. El acento se gana la atención porque hay muy poco de él.

> **Añade una nota más viva** Un naranja quemado, una mostaza o un verde azulado profundo con algo más de saturación que el resto da al ojo un sitio donde posarse. Sin él, una paleta terrosa puede resultar soñolienta.

### Errores comunes con los colores tierra

- **Cinco beiges seguidos.** Los colores de la misma luminosidad se funden; mantén al menos uno muy claro y uno muy oscuro.
- **Texto negro puro.** Se ve frío junto a marrones cálidos. Usa espresso o corteza.
- **Mezclar marrones cálidos y fríos.** Una terracota rosada junto a un topo grisáceo parece accidental. Mantén coherentes los subtonos.
- **Demasiados acentos.** Una nota viva eleva la paleta; tres la convierten en otra paleta distinta.

## Degradados de colores tierra

Los colores tierra se mezclan con facilidad porque ya están cerca en saturación, así que hay poco riesgo de un centro gris. Mantén la fuente de luz suave y añade grano, que va con la sensación de material de estos colores. [Degradados marrones](https://gradiently.design/es/guide/brown-gradient) y [degradados beige](https://gradiently.design/es/guide/beige-gradient) profundizan en cada familia.

- Del hueso a la terracota: `linear-gradient(160deg, #f3ece2 0%, #e0c3a3 50%, #c2703d 100%)`
- Sombra de oliva: `radial-gradient(circle at 75% 25%, #9caf88 0%, #6b7046 45%, #2a2a1a 100%)`
- Cosecha: `linear-gradient(180deg, #f1e4c8 0%, #c8963e 55%, #6b3e26 100%)`
- Brasas en la tierra: `radial-gradient(ellipse at 30% 110%, #b4644a 0%, #4a3b2c 45%, #14100c 90%)`

Cuatro degradados terrosos construidos con las paletas de arriba.

## Colores de texto sobre colores tierra

El negro puro y el blanco puro pueden resultar duros junto a colores tan suaves. Usa un marrón muy oscuro para el texto sobre fondos claros y un crema cálido sobre los oscuros; el blanco sigue funcionando sobre los tonos medios más profundos como siena y oliva. Los ratios usan la fórmula WCAG, donde 4,5:1 es el objetivo habitual para texto pequeño; [el contraste de color](https://gradiently.design/es/guide/color-contrast-accessibility) lo explica.

| Fondo | Texto | Contraste | Veredicto |
| --- | --- | --- | --- |
| Hueso `#f3ece2` | Corteza `#3d2b1f` | 11,5:1 | Excelente |
| Arena `#e7d8c3` | Corteza `#3d2b1f` | 9,6:1 | Excelente |
| Terracota `#c2703d` | Blanco | 3,7:1 | Solo titulares grandes |
| Siena `#a0522d` | Blanco | 5,6:1 | Bien |
| Oliva `#6b7046` | Blanco | 5,2:1 | Bien |
| Corteza `#3d2b1f` | Arena `#e7d8c3` | 9,6:1 | Excelente |

La terracota y el ocre son más claros de lo que parecen, así que comprueba con cuidado el texto blanco sobre ellos.

Una publicación vertical para una tienda de cerámica con letras marrón oscuro sobre un fondo cálido de hueso a terracota

Una publicación de tienda de cerámica en arcilla del desierto, con texto marrón corteza.

Una publicación cuadrada de tostador de café con letras color arena sobre un fondo marrón tierra oscuro

Una publicación de tostador de café en tierra oscura, con texto color arena.

## Paleta de colores tierra como variables CSS

```css
:root {
  --bone: #f3ece2;
  --dune: #e0c3a3;
  --terracotta: #c2703d;
  --rust: #8b4a2b;
  --bark: #3d2b1f;
}

body {
  background: var(--bone);
  color: var(--bark);
}

.button {
  background: var(--rust);
  color: var(--bone);
}

.tag {
  background: var(--terracotta);
  color: var(--bark);
  font-weight: 700;
}

.hero {
  background: linear-gradient(160deg, var(--bone) 0%, var(--dune) 55%, var(--terracotta) 100%);
}
```

La paleta arcilla del desierto como propiedades personalizadas. El hueso sobre óxido cumple para etiquetas de botón; la corteza sobre terracota solo llega a unos 3,6:1, así que reserva esa combinación para etiquetas grandes y en negrita.

Las paletas terrosas se solapan con las [paletas de colores de otoño](https://gradiently.design/es/guide/autumn-color-palettes), las [paletas de colores apagados](https://gradiently.design/es/guide/muted-color-palettes) y los [colores Japandi](https://gradiently.design/es/guide/japandi-colors), así que toma prestado de ellas cuando tengas una base. Si quieres un fondo terroso con material de verdad, los Marks de Gradiently combinan color con materiales, grano y luz, y el Designer puede maquetar publicaciones con tu Mark a partir de una descripción breve.

## FAQ

### ¿Qué colores son colores tierra?

Colores apagados, sobre todo cálidos, de materiales naturales: marrones, tostados, arena, beige, terracota, óxido, ocre, oliva, salvia, musgo y grises cálidos.

### ¿Cuáles son algunos códigos hex de colores tierra?

Arena `#e7d8c3`, ocre `#c8963e`, terracota `#c2703d`, siena `#a0522d`, oliva `#6b7046`, salvia `#9caf88` y corteza `#3d2b1f` son un buen conjunto de partida.

### ¿Qué color combina bien con los colores tierra?

Un verde azulado profundo, un naranja quemado o una mostaza usados como pequeño acento. El crema cálido y el espresso oscuro funcionan como extremos claro y oscuro.

### ¿Cómo evito que una paleta de colores tierra se vea apagada?

Reparte los colores entre valores claros, medios y oscuros, y añade un acento algo más saturado usado en cerca de una décima parte del diseño.

### ¿Son buenos los colores tierra para una marca?

Sí, para marcas que quieren transmitir calma, naturalidad y confianza, como negocios de interiorismo, comida, bienestar, aire libre y artesanía.
