# Triadiske farger og splittkomplementære paletter, forklart

[Canonical HTML page](https://gradiently.design/nb/guide/triadic-colors)

Tre jevnt fordelte farger kan få en palett til å føles dristig og balansert på én gang, eller som en leketøyskasse. Forskjellen handler nesten bare om hvilken farge som leder.

## The short version

- Triadiske farger er tre fargetoner fordelt jevnt rundt fargehjulet, en tredjedel av sirkelen fra hverandre, som rødt, gult og blått på malerens hjul.
- En triadisk palett fungerer når én farge dominerer, en annen støtter og den tredje brukes som en liten aksent.
- Å dempe to av de tre fargene er den raskeste måten å få en triadisk palett til å se voksen ut.
- En splittkomplementær palett bruker én fargetone pluss de to fargetonene på hver side av motsetningen, noe som gir sterk kontrast med mindre spenning.
- Triadiske farger fungerer som regel bedre som adskilte flater enn blandet sammen i én gradient.

**Triadiske farger** er tre fargetoner fordelt jevnt rundt fargehjulet, hver en tredjedel av sirkelen fra de andre. På malerens hjul danner rødt, gult og blått en triade, og det samme gjør oransje, grønt og fiolett. Fordi de tre ligger like langt fra hverandre, overdøver ingen av dem de andre bare i kraft av plasseringen, og det får triadiske paletter til å føles livlige og balanserte. Det gjør dem også lette å overdrive.

Denne guiden dekker triader, regelen som hindrer dem i å se ut som en leketøyskasse, og det splittkomplementære skjemaet, en nær slektning som er lettere å styre. Guiden om [fargehjulet](https://gradiently.design/nb/guide/color-wheel) forklarer de to typene hjul som nevnes under.

## Triadiske fargeskjemaer på hjulet

| Triade | Hjul | Karakter |
| --- | --- | --- |
| Rød, gul, blå | Malerens (primærfarger) | Dristig, grafisk, velkjent |
| Oransje, grønn, fiolett | Malerens (sekundærfarger) | Jordnær, uvanlig, rik |
| Rødoransje, gulgrønn, blåfiolett | Malerens (tertiærfarger) | Moderne, mindre forventet |
| Rød, grønn, blå | Skjerm (RGB) | Teknisk, høylytt i full styrke |
| Cyan, magenta, gul | Skjerm (RGB) | Trykkaktig, leken |

Vanlige triader. Roter trekanten hvor som helst på hjulet for å få flere.

- Marine (blå): #1e3a8a
- Sennep (gul): #d4a017
- Murstein (rød): #b91c1c
- Oliven (grønn): #4d7c0f
- Plomme (fiolett): #6b21a8
- Brent oransje: #c2410c

Primærtriaden og sekundærtriaden, begge gjort dypere enn full metning så de står lettere sammen.

## Dominansregelen: én farge leder

Tre sterke farger i like mengder konkurrerer om oppmerksomheten og virker barnslige. Løsningen er å rangere dem. Én farge dekker det meste av designet, en annen støtter, og den tredje dukker bare opp der du vil at øyet skal lande. En fordeling på 60, 30 og 10 er et godt utgangspunkt, som i [60-30-10-regelen](https://gradiently.design/nb/guide/60-30-10-rule).

- Like tredjedeler: konkurrerer: `linear-gradient(90deg, #b91c1c 0% 33.3%, #d4a017 33.3% 66.6%, #1e3a8a 66.6% 100%)`
- 60, 30, 10: marine leder: `linear-gradient(90deg, #1e3a8a 0% 60%, #d4a017 60% 90%, #b91c1c 90% 100%)`
- 60, 30, 10: oliven leder: `linear-gradient(90deg, #4d7c0f 0% 60%, #6b21a8 60% 90%, #c2410c 90% 100%)`

Samme type triade i ulike proporsjoner. Å rangere fargene gjør støy om til en palett.

Hvilken farge bør lede? Som regel den mørkeste eller minst mettede, fordi store flater i en sterk farge er slitsomme. Spar den sterkeste til aksenten. Er merkevarefargen din en del av triaden, er den ofte den opplagte lederen.

## Dempe en triade

Det andre verktøyet er metning. Hold én farge sterk og trekk de to andre mot grått, mørkere eller lysere. Strukturen i triaden overlever, så paletten føles fortsatt balansert, men den mister barneskolepreget. Mange redaksjonelle og tradisjonsrike paletter er triader i forkledning: marine, oker og murstein, eller oliven, plomme og rust.

- Blekkmarine: #1f2a44
- Havre: #e9dcc3
- Oker: #b98b2e
- Murstein: #9b3d33

En dempet primærtriade med en varm nøytral. Den virker redaksjonell heller enn leken.

## Hvor triadiske paletter fungerer

Triader passer til merkevarer og prosjekter som vil føles energiske, inkluderende eller lekne uten å se tilfeldige ut: undervisning for barn, spill, festivaler, mat og lokale fellesskap. De er også nyttige i systemer som trenger tre tydelig adskilte kategorier, som tre produktlinjer, tre kursnivåer eller tre typer arrangementer, fordi hver farge ligger så langt som mulig fra de to andre.

- **Tre kategorier:** gi hver sin farge fra triaden og hold oppsettene identiske, så fargen gjør sorteringen.
- **Én merkevare, én leder:** bruk lederfargen overalt og hent inn de to andre til illustrasjoner, diagrammer og uthevinger.
- **Plakater og emballasje:** en dempet triade på en varm nøytral gir et trykt preg fra midten av forrige århundre. Planlegg fargene for trykkfarge, se [å trykke gradienter](https://gradiently.design/nb/guide/print-gradients).
- **Grensesnitt:** behold triaden til status og illustrasjoner og la nøytrale farger bære skjermene, ellers føles hver side høylytt.

## Splittkomplementære farger

Et splittkomplementært skjema starter med én fargetone, og i stedet for den direkte motsetningen bruker det de to fargetonene på hver side av den. Du beholder det meste av kontrasten fra et [komplementært par](https://gradiently.design/nb/guide/complementary-colors), men slipper frontkollisjonen, og du får en tredje farge å jobbe med. Det er et av de mest tilgivende skjemaene for nybegynnere.

- Base: fiolett: #5b21b6
- Splitt: lime: #a3e635
- Splitt: rav: #f59e0b
- Nøytral: lillahvit: #f5f3ff

Motsetningen til fiolett på malerens hjul er gul. Splitten bruker fargene på hver side av den, lime og rav.

- **Basefarge:** lederen, som brukes til det meste av designet.
- **Første splittfarge:** støtte, på mindre flater eller i en roligere versjon.
- **Andre splittfarge:** aksenten, som brukes sparsomt.
- **Nøytral:** en nesten hvit eller nesten svart som holder det hele sammen.

## Triadiske farger i gradienter

Blander du alle tre fargene i en triade i én gradient, tvinges overgangen gjennom hver fargetone mellom dem, og minst én overgang blir som regel matt. Triader fungerer bedre som adskilte flater, eller som en tofarget gradient med den tredje fargen som aksent.

- Alle tre blandet: grumsete andre halvdel: `linear-gradient(90deg, #b91c1c 0%, #d4a017 50%, #1e3a8a 100%)`
- Marine over i murstein, via plomme: `linear-gradient(135deg, #1e3a8a 0%, #6b2a6e 55%, #b91c1c 100%)`
- Sennep beholdt som aksent med skarp kant: `linear-gradient(135deg, #1e3a8a 0%, #6b2a6e 50%, #b91c1c 86%, #d4a017 86%, #d4a017 100%)`

To triadefarger blandes, den tredje står for seg selv. Halvdelen fra gult til blått i det første eksempelet viser hvorfor.

## Feil med triadiske paletter

### Unngå

- Tre mettede farger i like mengder
- Tekst satt i aksentfargen
- Alle tre blandet i én gradient
- Ingen nøytral som øyet kan hvile på

### Gjør

- Én leder, én støtte, én aksent
- Tekst i en nøytral med sterk kontrast
- Adskilte flater, eller to blandet pluss en aksent
- En nesten hvit eller nesten svart ved siden av

Føles en triade fortsatt for høylytt, kan du gå ned til en [analog palett](https://gradiently.design/nb/guide/analogous-colors), der fargene er naboer i stedet for motsetninger.

## FAQ

### Hva er triadiske farger?

Triadiske farger er tre fargetoner jevnt fordelt rundt fargehjulet, hver en tredjedel av sirkelen fra hverandre, som rødt, gult og blått på malerens hjul.

### Hvordan bruker du et triadisk fargeskjema?

La én farge dominere, en annen støtte og den tredje være en liten aksent. Å dempe to av de tre gjør paletten lettere å leve med.

### Hva er et splittkomplementært fargeskjema?

En basefargetone pluss de to fargetonene på hver side av komplementærfargen. Det beholder sterk kontrast med mindre spenning enn et direkte komplementært par.

### Hva er forskjellen på triadiske og komplementære farger?

Komplementært bruker to motsatte fargetoner, triadisk bruker tre fargetoner fordelt jevnt rundt hjulet. Triader er mer varierte og som regel litt mindre spente.