# Petrol (teal): farvens betydning, og hvorfor brands elsker den

[Canonical HTML page](https://gradiently.design/da/guide/teal-color-meaning)

Petrol gør to ting på én gang: den beroliger som blå og forfrisker som grøn. Den dobbelte betydning, og det at den ikke er almindelig blå, er grunden til, at så mange brands inden for sundhed, penge og tech griber efter den.

## The short version

- Petrol, på engelsk teal, kombinerer blås ro, klarhed og tillid med grøns fornyelse, sundhed og balance.
- Det engelske navn teal kommer fra krikanden, en lille and, hvor hannerne har et skinnende grønt bånd ved øjet.
- Den navngivne CSS-farve teal er #008080, en mellemblågrøn lavet af lige dele grøn og blå uden rød.
- Brands vælger petrol, fordi den føles troværdig som blå, men skiller sig ud fra de mange brands, der allerede bruger blå.
- Orange og koral er petrols naturlige komplementærfarver, og derfor er petrol og orange en så almindelig kombination i film og design.

**Petrol**, som på engelsk hedder teal, betyder ro med puls: den forener blås tillid, klarhed og fatning med grøns fornyelse, sundhed og balance. Petrol opleves som frisk men seriøs, eftertænksom men ikke kold. Den undgår også mængden. Et brand, der vil have blås tryghed uden at ligne alle banker og softwarefirmaer, har et klart svar i petrol, og det er en stor del af grunden til, at den dukker op inden for sundhed, finans, velvære og teknologi.

## Hvor navnet kommer fra

Det engelske navn teal kommer fra krikanden, en lille svømmeand, hvor hannerne har et bredt bånd af skinnende grønt fra øjet og bagud. Ordet kom i brug som farvenavn på engelsk i begyndelsen af det tyvende århundrede. På skærme betyder teal lige meget grønt og blåt lys og intet rødt; CSS-nøgleordet `teal` er præcis det.

```css
:root {
  /* The CSS named colour */
  --teal: teal; /* #008080, rgb(0 128 128) */

  /* A practical brand scale */
  --teal-100: #ccfbf1;
  --teal-300: #5eead4;
  --teal-500: #14b8a6;
  --teal-700: #0f766e;
  --teal-900: #134e4a;
}
```

Nøgleordet `teal` og en skala i fem trin, du kan sætte ind i et stylesheet. Trin 700 bærer hvid tekst uden besvær.

## Petrols farvepsykologi

De fleste af petrols associationer kommer fra vand og natur: lavt tropisk hav, laguner, mineralske kilder og irret på gammelt kobber. De billeder får den til at føles ren, kølig, genopbyggende og en anelse kostbar. Som med al farvebetydning er det lærte associationer snarere end regler, og [farvepsykologi](https://gradiently.design/da/guide/color-psychology) forklarer, hvorfor sammenhængen flytter dem.

| Fra blå | Fra grøn | Petrols egen |
| --- | --- | --- |
| Tillid | Fornyelse | Klarhed med varme |
| Ro | Sundhed | Frisk men voksen |
| Kompetence | Balance | Hverken korporativ eller rustik |
| Dybde | Vækst | Moderne og kønsneutral |

Petrol låner fra begge forældre og ender med sin helt egen karakter.

## Petrolnuancer, og hvad hver af dem siger

- Havskum: #ccfbf1
- Aquapetrol: #5eead4
- Klar petrol: #14b8a6
- CSS-teal: #008080
- Dyb petrol: #0f766e
- Mørk petrol: #134e4a
- Afgrund: #042f2e
- Støvet petrol: #5f8f8a

Lyse petrolnuancer føles luftige og kliniske, mørke føles dybe og stille, og støvet petrol føles som indretning og håndværk.

- **Havskum og aquapetrol:** friskhed, spa, sommer, imødekommenhed.
- **Klar petrol:** energi og optimisme med et teknisk præg; god til apps og dashboards.
- **Dyb og mørk petrol:** selvtillid, dybde og luksus; et stærkt alternativ til marineblå.
- **Støvet petrol:** ro, vintage og håndlavet; virker til boligudstyr, keramik og caféer.

## Hvorfor brands elsker petrol

Petrol løser et almindeligt brandingproblem. Blå er det sikre valg til alt, der handler om penge, sundhed eller data, så mange konkurrenter bruger den allerede. Petrol beholder det meste af blås troværdighed og tilføjer en følelse af omsorg og friskhed, hvilket er præcis den tone, en klinik, en pensionsapp eller en velværeservice ønsker. Den er også fri for den stærke kønskodning, som pink og nogle blå nuancer bærer på.

Der er steder, hvor petrol passer dårligere. Hvis hele din kategori allerede hælder mod petrol, som nogle markeder for velvære og tandpleje gør, holder den op med at skille sig ud, og du får brug for et andet kendetegn. Meget klar petrol kan også føles ung og teknisk, hvilket kan skurre for et traditionsrigt advokatfirma eller en bedemand. I de tilfælde bevarer en støvet eller meget mørk petrol roen uden startupfølelsen. [Sådan vælger du brandfarver](https://gradiently.design/da/guide/how-to-choose-brand-colors) har en mere komplet metode.

Kvadratisk opslag fra en klinik på en rolig petrolgradient, der annoncerer tider samme dag

Petrol til en klinik: rolig, ren og troværdig uden kulden fra hospitalsblå.

Kvadratisk opslag fra en finansapp på en dyb petrolbaggrund med linjen Din opsparing med ét blik

Dyb petrol til en pengeapp: troværdig som en bank, men varmere og mere moderne.

## Sådan bygger du et brand omkring petrol

1. **Bestem, hvor lys eller dyb** Lyse petrolnuancer føles åbne og venlige; dybe føles etablerede. Vælg én hovedpetrol, og skriv dens hexkode ned, så alle filer bruger præcis samme farve.
2. **Giv den en tekstfarve** Tjek, hvilket blæk der kan læses på din hovedpetrol. Klare nuancer vil have næsten sort tekst; dybe nuancer tager hvid.
3. **Tilføj en varm accent** Én koral, orange eller guld brugt i små doser forhindrer en petrolpalet i at føles klinisk. Gem den til knapper, priser eller en enkelt form.
4. **Test den tidligt på tryk** Meget klare petrolnuancer på skærmen kan blive mærkbart mattere på tryk. Bed om en prøve, før du bestiller emballage eller skilte; [RGB vs. CMYK](https://gradiently.design/da/guide/rgb-vs-cmyk) forklarer hvorfor.
5. **Før den videre i baggrunde** Opslag på sociale medier og slides er der, hvor folk oftest ser et brand. En konsekvent petrolbaggrund på tværs af dem gør mere for genkendelsen end logoet alene.

## Farver, der passer til petrol

Petrols komplementærfarve ligger i det orange og koralfarvede område, så varme accenter får den til at gløde. Den modsætning ligger også bag den velkendte petrol og orange farvekorrektion i film, hvor kølige skygger fremhæver varm hud. Til roligere paletter holder du petrol sammen med sine naboer, marineblå og salviegrøn, som i [analoge farver](https://gradiently.design/da/guide/analogous-colors).

- Petrol til orange: `linear-gradient(135deg, #134e4a 0%, #0f766e 50%, #f97316 100%)`
- Havskum til dyb petrol: `linear-gradient(160deg, #ccfbf1 0%, #5eead4 50%, #0f766e 100%)`
- Lagune om natten: `radial-gradient(circle at 70% 30%, #14b8a6 0%, #134e4a 50%, #042f2e 100%)`
- Petrol og koral: `linear-gradient(135deg, #0f766e 0%, #fb7185 100%)`

Petrol med sine varme komplementærfarver og med sine egne dybere nuancer. Mere i [petrolgradienter](https://gradiently.design/da/guide/teal-gradient).

### Undgå

- Hvid tekst på klar petrol `#14b8a6`: cirka 2,5:1
- Hvid tekst på `#0d9488`: cirka 3,7:1, stadig under 4,5:1
- Petrol direkte over i rød, som bliver mudret på midten

### Gør

- Næsten sort tekst på klar petrol, omkring 8:1
- Hvid tekst på dyb petrol `#0f766e`, cirka 5,5:1
- Bland petrol gennem marineblå eller grøn, ikke på tværs af hjulet

Tjek dine egne par med metoden i [farvekontrast og tilgængelighed](https://gradiently.design/da/guide/color-contrast-accessibility), og se [turkise gradienter](https://gradiently.design/da/guide/turquoise-gradient), hvis du vil have en klarere, mere solrig version af samme familie. Vil du have et petrollook, der kun er dit, så søg efter »dyb petrol« i Markedet på Gradiently: hver Mark har én ejer ad gangen og holder din tekst læselig, mens den bevæger sig.

## FAQ

### Hvad betyder farven petrol?

Petrol betyder ro, klarhed og tillid fra blå sammen med fornyelse, sundhed og balance fra grøn. Den opleves som frisk og moderne, men stadig seriøs.

### Hvad er hexkoden for teal?

Den navngivne CSS-farve teal er #008080. Brands bruger ofte lysere eller dybere versioner som #14b8a6 eller #0f766e.

### Er petrol blå eller grøn?

Begge dele. Petrol er en blågrøn, som på skærmen laves af lige meget grønt og blåt lys uden rødt.

### Hvilken farve passer bedst til petrol?

Orange og koral er dens komplementærfarver og får den til at gløde. Marineblå, salviegrøn, creme og guld giver roligere og mere elegante kombinationer.

### Hvad symboliserer mørk petrol?

Mørk petrol signalerer dybde, selvtillid og stille luksus. Mange brands bruger den som et varmere og mere karakteristisk alternativ til marineblå.