# Fargekombinasjoner til logoer som virker, med hex-koder

[Canonical HTML page](https://gradiently.design/nb/guide/color-combinations-for-logos)

En logo må tåle et favicon, en grå kopi og en topp i mørk modus. Disse parene og treklangene er valgt for å gjøre det, med koder og kontrast du kan sjekke selv.

## The short version

- De fleste sterke logoer bruker én eller to farger, fordi hver ekstra farge gjør logoen vanskeligere å gjengi lite, på trykk og på ulike bakgrunner.
- En god tofarget logo kombinerer mørkt med lyst eller sterkt, så formene er tydelige selv når fargene er vanskelige å skille.
- To farger med lignende lyshet, som mellomrødt og mellomblått, ser ut til å vibrere der de møtes og mister skillet i grått trykk.
- Alle logoer bør også virke i én farge, både svart og hvitt, før farge legges til.
- Logofargene trenger ikke være hele merkevarepaletten. Logoen kan være enkel mens bakgrunnene rundt bærer rikere farger.

De **fargekombinasjonene til logoer** som virker best kombinerer én mørk farge med én lys eller sterk, som marineblått og gull, skoggrønt og krem eller koksgrått og lime. Lyshetsforskjellen holder formene lesbare i favicon-størrelse og gråtoner, mens fargetonen gir personlighet. Nedenfor får du ti testede par og tre treklanger med hex-koder og kontrastforhold, og en rask måte å teste kombinasjoner selv.

## Hvorfor logoer bruker så få farger

En logo er det en bedrift gjengir oftest. Den vises som et nettleserikon på 16 piksler, brodert på en skjorte, stemplet på en kaffekopp og trykt i én farge på en kvittering. Hver ekstra farge er én ting til som kan gå galt et av stedene. Derfor er så mange kjente logoer ensfargede, og de fleste andre tofargede.

Start i svart. Virker formen svart på hvitt og hvitt på svart, kan farge bare hjelpe. Virker den ikke, redder ingen kombinasjon den. [Grunnleggende logodesign](https://gradiently.design/nb/guide/logo-design-basics) dekker formen. Her forutsetter vi at den er avklart.

## Ti tofargede logokombinasjoner

- Marineblått og gull: `linear-gradient(90deg, #14213d 0%, #14213d 55%, #fca311 55%, #fca311 100%)`
- Skoggrønt og krem: `linear-gradient(90deg, #1b4332 0%, #1b4332 55%, #f1e9da 55%, #f1e9da 100%)`
- Koksgrått og lime: `linear-gradient(90deg, #2d2d2d 0%, #2d2d2d 55%, #c6f432 55%, #c6f432 100%)`
- Plomme og lys rosa: `linear-gradient(90deg, #4a1942 0%, #4a1942 55%, #f7c8d0 55%, #f7c8d0 100%)`
- Burgunder og sand: `linear-gradient(90deg, #6b0f1a 0%, #6b0f1a 55%, #e9d8a6 55%, #e9d8a6 100%)`
- Blekk og oransje: `linear-gradient(90deg, #1c1917 0%, #1c1917 55%, #f97316 55%, #f97316 100%)`
- Lilla og mint: `linear-gradient(90deg, #5b21b6 0%, #5b21b6 55%, #a7f3d0 55%, #a7f3d0 100%)`
- Kobolt og hvitt: `linear-gradient(90deg, #1d4ed8 0%, #1d4ed8 55%, #ffffff 55%, #ffffff 100%)`
- Svart og signalrødt: `linear-gradient(90deg, #111111 0%, #111111 55%, #e63946 55%, #e63946 100%)`
- Blågrønt og korall: `linear-gradient(90deg, #0f766e 0%, #0f766e 55%, #ff7f6e 55%, #ff7f6e 100%)`

Ti par med skarpt skille, slik de møtes i en logo. Klikk en fargeprøve for å kopiere koden.

| Par | Koder | Kontrast | Føles som |
| --- | --- | --- | --- |
| Marineblått og gull | `#14213d` `#fca311` | 7,9:1 | Etablert, trygg, litt klassisk |
| Skoggrønt og krem | `#1b4332` `#f1e9da` | 9,2:1 | Naturlig, håndlaget, rolig |
| Koksgrått og lime | `#2d2d2d` `#c6f432` | 10,7:1 | Energisk, sporty, teknisk |
| Plomme og lys rosa | `#4a1942` `#f7c8d0` | 9,4:1 | Varm, skjønnhet, boutique |
| Burgunder og sand | `#6b0f1a` `#e9d8a6` | 8,7:1 | Tradisjon, vin, gjestfrihet |
| Blekk og oransje | `#1c1917` `#f97316` | 6,2:1 | Praktisk, vennlig, håndverk og verktøy |
| Lilla og mint | `#5b21b6` `#a7f3d0` | 7,0:1 | Moderne, leken, programvare |
| Kobolt og hvitt | `#1d4ed8` `#ffffff` | 6,7:1 | Tydelig, pålitelig, digital |
| Svart og signalrødt | `#111111` `#e63946` | 4,5:1 | Modig, presserende, redaksjonell |
| Blågrønt og korall | `#0f766e` `#ff7f6e` | 2,2:1 | Livlig, men bare som tilstøtende former, aldri tekst mot tekst |

WCAG-kontrastforhold mellom hvert par. Over 4,5:1 kan én farge brukes som skrift på den andre. Lavere par bør stå side om side som former.

Blågrønt og korall skiller seg ut. Begge har lignende lyshet, så korallfargede bokstaver på et blågrønt merke blir vanskelige å lese og én grå klump i svart-hvitt-trykk. Paret virker fortsatt som separate former, for eksempel et blågrønt symbol ved siden av en korallfarget ordlogo, begge på hvit eller mørk bunn. Tallene kommer fra WCAG-formelen i [fargekontrast og tilgjengelighet](https://gradiently.design/nb/guide/color-contrast-accessibility).

## Trefargede logokombinasjoner

Tre farger passer logoer med separate deler: et symbol av fliser, en ordlogo med farget prikk eller et sett former for et barnemerke. Forankre trioen med én mørk farge og velg to med tydelig ulik tone. Fordeling rundt fargesirkelen, som i [triadiske farger](https://gradiently.design/nb/guide/triadic-colors), holder dem fra å konkurrere.

- Dyphav: #003049
- Valmue: #d62828
- Sennep: #fcbf49

Voksne primærfarger. Mørk blått forankrer rødt og gult som ellers ville ropt. Bra til skoler, sport og leker rettet mot foreldre.

- Skiferblågrønn: #264653
- Safran: #e9c46a
- Brent korall: #e76f51

Kystvarme. Skiferblågrønt bærer ordlogoen, mens safran og brent korall fyller symbolformene.

- Natt: #10002b
- Magenta: #f72585
- Cyan: #4cc9f0

Digitalt og høylytt. Magenta og cyan gløder mot nesten svart, til logoer for musikk, spill og uteliv.

## Logofargekombinasjoner du bør unngå

### Unngå

- Mellomrødt og mellomblått som møtes: de virker vibrerende
- Rent rødt og rent grønt sammen: vanskelig for mange fargeblinde
- Gult eller lyse pasteller på hvitt: logoen forsvinner
- Fire eller flere like dominerende farger
- En gradient som eneste logoversjon

### Gjør heller

- Gjør én av fargene mye mørkere
- Skill dem etter lyshet, ikke bare tone
- Legg lyse farger på mørk bunn eller gi dem kontur
- Én hovedfarge og én eller to støttefarger
- En flat versjon først, gradienten som variant

Gradientlogoer er et særtilfelle. De kan se flotte ut stort, men får striper på trykk og blir uklare i liten størrelse. Behold en flat én- eller tofargeversjon og bruk gradienten som variant. [Gradientlogoer](https://gradiently.design/nb/guide/gradient-logo) forklarer hvordan du bygger begge.

## Slik tester du en logofargekombinasjon

1. **Trykk den i gråtoner** Gjør logoen grå. Blir de to fargene samme grå, er lyshetsforskjellen for liten.
2. **Krymp til 16 piksler** Se den som et nettleserikon. Tynne deler i lys farge forsvinner først.
3. **Snu den** Plasser logoen på den mørkeste merkefargen og på hvitt. Noter hvilken farge som må byttes i hvert tilfelle.
4. **Sjekk fargeblindhet** Bruk en fargeblindhetssimulator. Rød-grønne par flyter ofte sammen for dem med de vanligste formene for fargeblindhet.
5. **Legg den på en ekte bakgrunn** En logo ligger sjelden på rent hvitt i bruk. Test på foto, gradient og en urolig strøm.

Et kvadratisk design med Harbour over en gradient, der deler av bokstavene forsvinner

En ordlogo rett over en livlig bakgrunn kan miste deler av bokstavene.

Samme kvadratiske design med roligere bakgrunn bak Harbour, så alle bokstaver kan leses

Samme ordlogo med en bakgrunn som roer og mørkner seg bak den.

Den siste testen er der mange logoer sliter. [Plassere en logo på gradientbakgrunn](https://gradiently.design/nb/guide/logo-on-gradient-background) dekker teknikkene. I Gradiently vet en Mark hvor ord og logo står: det roligste området flyttes bak dem og Auto-tekstfarge velger lyst eller mørkt per linje fra Markens egen palett. En enkel tofarget logo kan derfor ligge på en rik bakgrunn uten en boks bak.

## Hold logoen enkel og la merkevaren være rik

Logoen trenger ikke bære alle fargene merkevaren bruker. Mange holder den i én eller to farger og legger dybden i bakgrunn, foto og skrift. Skal du velge den større paletten, har [ideer til merkefarger](https://gradiently.design/nb/guide/brand-color-ideas) 30 utgangspunkt. [Kjente gradientlogoer](https://gradiently.design/nb/guide/famous-gradient-logos) viser hvordan etablerte merkevarer balanserer en enkel logo med uttrykksfull farge.

## FAQ

### Hva er den beste fargekombinasjonen til en logo?

Ingen enkeltpar er best, men mørkt med lyst eller sterkt, som marineblått og gull eller skoggrønt og krem, virker nesten overalt fordi formene forblir tydelige.

### Hvor mange farger bør en logo ha?

Én eller to for de fleste logoer. Tre kan fungere for logoer med separate deler, men hver ekstra farge gjør trykk og små størrelser vanskeligere.

### Hvilke farger bør ikke brukes sammen i en logo?

Unngå farger med lik lyshet som møtes, som mellomrødt og mellomblått. Unngå å stole på rødt mot grønt, som mange fargeblinde ikke kan skille.

### Bør en logo fungere i svart og hvitt?

Ja. Den bør virke i én farge, svart og hvitt, før farge legges til, fordi den vil trykkes og stemples i én farge.

### Kan en logo være en gradient?

Ja, men behold en flat versjon for små størrelser, broderi og enfarget trykk. Bruk gradienten der den har plass.