# Goud kleurverloop: codes voor metallic goud dat echt oogt

[Canonical HTML page](https://gradiently.design/nl/guide/gold-gradient-design)

Digitaal goud ziet er meestal uit als sinaasappelsap of mosterd. Echt goud is vooral bruine schaduw, een beetje oker en één bleke lichtflits. Hier zijn codes die het goed doen, en waarom ze werken.

## The short version

- Een realistisch goud kleurverloop loopt van een diepbruine schaduw via een gedempte okerkleurige middentint naar een bleke crème highlight en dan terug naar schaduw.
- Goud lijkt oranje als de kleuren te verzadigd en te rood zijn en als vlak geel als het een donkere schaduw en een bijna witte highlight mist.
- Metallic goud hangt af van contrast: de donkerste en lichtste stops moeten qua helderheid ver uit elkaar liggen, met een smalle highlight.
- In CSS is goudtekst een gouden lineair kleurverloop dat met background-clip: text op de letters wordt bijgesneden.
- Goud ziet er het kostbaarst uit als je het spaarzaam gebruikt, op een donkere ondergrond zoals zwart, marineblauw of diepgroen.

Een **goud kleurverloop** oogt als echt metaal als het een breed helderheidsbereik beslaat: een diepbruine schaduw, een gedempt okerkleurig midden, een smalle bleke crème highlight en weer terug naar bruin. De klassieke code om mee te beginnen is `linear-gradient(135deg, #5c3d12, #b8862b, #f3dc9a, #c79a3c, #7a5418)`. De meeste goudverlopen mislukken omdat ze twee felle gele en oranje tinten gebruiken zonder echte schaduw of highlight, wat leest als oranje verf en niet als metaal.

## Codes voor een goud kleurverloop om te kopiëren

- Klassiek goud: `linear-gradient(135deg, #5c3d12 0%, #b8862b 22%, #f3dc9a 45%, #c79a3c 58%, #7a5418 80%, #d6b062 100%)`
- Champagnegoud: `linear-gradient(135deg, #6b5534 0%, #c2a878 25%, #f6ecd2 48%, #cdb486 62%, #85704a 100%)`
- Rosegoud: `linear-gradient(135deg, #6e3f33 0%, #b97a68 25%, #f2cdbf 48%, #c48876 62%, #7e4b3d 100%)`
- Antiek goud: `linear-gradient(135deg, #2f2210 0%, #7a5c26 30%, #c4a25a 50%, #8a6a2e 68%, #3e2c12 100%)`
- Helder bladgoud: `linear-gradient(180deg, #6b4a0f 0%, #d4a73e 30%, #fff1b8 46%, #e0b44c 54%, #8c6216 85%, #5a3d0c 100%)`
- Goudlicht op zwart: `radial-gradient(ellipse at 70% 25%, #e8c877 0%, #9c7428 22%, #3a2a10 50%, #0d0b08 85%)`

Zes goudtinten, elk met een donkere schaduw en een smalle lichte highlight. De eerste vijf zijn voor letters, randen en vormen, de laatste is een achtergrond.

- Schaduwbrons: #5c3d12
- Diep oker: #7a5418
- Oud goud: #b8862b
- Metallic goud: #c79a3c
- Bleke highlight: #f3dc9a
- Spiegelend crème: #fff6dc

De goudkleurcodes achter Klassiek goud, van schaduw tot highlight, plus een spiegelend crème om alleen in een streepje te gebruiken, als het al nodig is.

## Waarom je goud kleurverloop oranje lijkt

Op schermen is goud een illusie gemaakt van contrast. Er bestaat geen goudkleurige pixel, alleen bruinen en gelen die zo zijn geschikt dat het oog een weerkaatsend oppervlak leest. Als er iets misgaat, gaat het meestal op een van vier manieren mis.

| Het lijkt | Waarom | Oplossing |
| --- | --- | --- |
| Oranje | Middentinten te rood en te verzadigd | Schuif tinten naar geeloker en verlaag de verzadiging |
| Vlak geel | Geen donkere schaduw, geen bleke highlight | Voeg een bruine stop bij de uiteinden en een crèmekleurige stop in het midden toe |
| Bruin of modderig | Highlight te donker, te veel doffe stops | Til de highlight tot bijna crème en versmal de donkere zones |
| Groenig | Gelen te koel, schaduwen te grijs | Verwarm de schaduwen naar bruin in plaats van olijf of grijs |

De vier klassieke goudfouten en hoe je ze elk verhelpt.

Het oranjeprobleem is het meest voorkomende omdat het geel dat je in een kleurkiezer kiest vaak te bleek lijkt, waardoor mensen het warmer maken. Doe dat niet: houd de middentint rond oker, grofweg waar geel in bruin overgaat, en laat contrast de glans leveren. Als je eigenlijk een gewone warme overgang wilt, behandelen [geel kleurverloop](https://gradiently.design/nl/guide/yellow-gradient) en [oranje kleurverloop](https://gradiently.design/nl/guide/orange-gradient) die rechtstreeks.

## Zo belicht je goud zodat het echt oogt

1. **Begin bij de schaduw** Kies een diep, warm bruin. Het moet donker genoeg zijn dat witte tekst erop leest.
2. **Voeg één gedempte middentint toe** Een okerkleurig goud, licht onderverzadigd. Dit is de kleur die mensen zich herinneren, dus het grootste deel van het oppervlak zit hier.
3. **Plaats een smalle highlight** Een bleek crème in een dunne band, naast het midden. Hoe smaller hij is, hoe glanzender het metaal oogt.
4. **Keer terug naar schaduw** Val na de highlight terug op een donkerder oker, zodat het licht als weerspiegeling op een gebogen oppervlak leest.
5. **Voeg een tweede, zwakkere highlight toe** Optioneel: een zachtere opleving bij het andere uiteinde, alsof een tweede lamp de rand raakt. Het laat vlakke vormen rond aanvoelen.

Goud weerkaatst als elk gepolijst metaal, dus dezelfde logica als achter het [chroom-teksteffect](https://gradiently.design/nl/guide/chrome-effect) geldt, alleen warmer en met zachtere overgangen. Goudverlopen met lange, subtiele stukken kunnen na compressie banding laten zien. [Banding in kleurverlopen](https://gradiently.design/nl/guide/gradient-banding) legt uit hoe fijne korrel dat voorkomt.

## Goudtekst in CSS

```css
.gold {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 700;
  font-size: clamp(2.5rem, 8vw, 6rem);
  color: #c79a3c; /* fallback */
  background: linear-gradient(
    135deg,
    #5c3d12 0%, #b8862b 22%, #f3dc9a 45%,
    #c79a3c 58%, #7a5418 80%, #d6b062 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gold-rule {
  height: 2px;
  border: 0;
  background: linear-gradient(90deg, transparent, #b8862b 20%, #f3dc9a 50%, #b8862b 80%, transparent);
}
```

Gouden koptekst en een dunne gouden scheidingslijn. De terugvalkleur verschijnt waar bijsnijden met een kleurverloop niet wordt ondersteund.

Goudverlopen passen bij schreeflettertypen en letters met hoog contrast op grote formaten. Onder ongeveer 24 pixels lopen schaduw en highlight uit tot een egaal bruin, dus zet kleine tekst in een effen goudtint zoals `#c79a3c` en controleer het contrast met de achtergrond. [Tekst met kleurverloop](https://gradiently.design/nl/guide/css-gradient-text) behandelt de browserondersteuning voor de bijsnijtechniek.

## Goudverlopen in druk

Een goud kleurverloop is een plaatje van metaal, geen metaal. In gewone vierkleurendruk komt het uit als bruinen en gelen die glans suggereren, wat prima is voor flyers en posters maar nooit echt weerkaatsend. Voor uitnodigingen, visitekaartjes en verpakkingen waar echte glans telt, gebruiken drukkers metallic inkt of folieprint, en lever je het goudgebied als aparte vlakke vorm in het ontwerp aan.

Druk je wel een kleurverloop, verwacht dan dat het iets donkerder en minder levendig uitkomt dan op het scherm. Maak de highlight een tikje helderder, vermijd heel lange subtiele stukken die banding kunnen geven en vraag een proef voor een grote oplage.

## Ontwerpen met goud

Goud leest als kostbaar als het zeldzaam is. Een dunne rand, een monogram, één woord in een kop, een scheidingslijn: op een donkere ondergrond van zwart, marineblauw, ossenbloed of diepgroen. Bedek een hele poster met goud en het wordt koperachtig. [Zwart en goud kleurverloop](https://gradiently.design/nl/guide/black-and-gold-gradient) heeft combinaties voor de meest klassieke combinatie en [luxe merkontwerp](https://gradiently.design/nl/guide/luxury-design) laat zien hoe goud in een ingetogen identiteit past.

Een staande galauitnodiging op een donkere achtergrond met warm goudlicht en crèmekleurige letters

Een uitnodiging van 5×7 inch: een donkere ondergrond met warm metallic licht en woorden in rustig crème.

Een staande juwelierspost met een korte regel op een diep oppervlak dat met goudlicht is aangeraakt

Een juwelierspost waarin goud alleen als licht op het oppervlak verschijnt, nooit als grote vlakke vulling.

Wil je een warme look die achter elk ontwerp leeft in plaats van elke keer opnieuw te worden gebouwd, zoek dan op de Markt van Gradiently met kleurwoorden als ‘warm goud’ of ‘brons’. Elke Mark is een levende achtergrond met licht en korrel, die op elk moment maar één eigenaar kan hebben en zijn rustigste gebied op elk formaat achter je woorden houdt.

## FAQ

### Wat is de beste code voor een goud kleurverloop?

Een goed beginpunt is `linear-gradient(135deg, #5c3d12, #b8862b, #f3dc9a, #c79a3c, #7a5418)`: bruine schaduw, okerkleurige middentint, bleke highlight en terug naar schaduw.

### Welke hexcodes maken metallic goud?

Combineer een donker brons als #5c3d12, een oud goud als #b8862b, een metallic goud als #c79a3c en een bleke highlight als #f3dc9a.

### Waarom ziet mijn goud kleurverloop er oranje uit?

De middentinten zijn te rood en te verzadigd. Schuif ze naar geeloker, verlaag de verzadiging en voeg een donkerbruine schaduw en een bleke crème highlight toe voor contrast.

### Hoe maak ik goudtekst in CSS?

Pas een gouden lineair kleurverloop toe als achtergrond en gebruik dan `background-clip: text` en `-webkit-text-fill-color: transparent`, met een effen gouden `color` als terugval.

### Welke kleur past het best bij goud?

Zwart, marineblauw, diepgroen, ossenbloed en warm crème. Donkere ondergronden laten goud het helderst en kostbaarst ogen.