Markkinat
Hinnoittelu
Kirjaudu sisäänAloita
SuunnitteluopasIdeat ja trendit
Ideat ja trendit

Logon väriyhdistelmät, jotka toimivat: hex-koodit

Logon pitää kestää favicon, harmaa valokopio ja tumman tilan otsake. Nämä parit ja kolmikot on valittu siihen, ja voit tarkistaa koodit ja kontrastin itse.

GradientlyVahvistettu Gradiently-tili·1. lokakuuta 2026·4 min lukuaika
Kansi: Meridian of Velvet · GR·979F·H4

Lyhyesti

  • Useimmat vahvat logot käyttävät yhtä tai kahta väriä, sillä jokainen lisäväri vaikeuttaa toistoa pienenä, painossa ja vaihtelevilla taustoilla.
  • Hyvä kaksivärinen logo yhdistää tumman vaaleaan tai kirkkaaseen, jotta muodot erottuvat myös silloin, kun värejä on vaikea erottaa.
  • Samassa vaaleudessa olevat värit, kuten keskisävyinen punainen ja sininen, näyttävät värisevän kosketuskohdassa ja menettävät rajansa harmaapainatuksessa.
  • Jokaisen logon tulee toimia myös yhtenä värinä, mustana ja valkoisena, ennen värien lisäämistä.
  • Logon värien ei tarvitse kattaa brändin koko palettia: tunnus voi pysyä yksinkertaisena ja taustat kantaa rikkaamman värin.
Tällä sivulla
Miksi logoissa on niin vähän värejäKymmenen kaksiväristä logoyhdistelmääKolmiväriset logoyhdistelmätLogon vältettävät väriyhdistelmätLogon väriyhdistelmän testausPidä logo yksinkertaisena ja brändi rikkaana

Parhaat logon väriyhdistelmät liittävät yhden tumman värin yhteen vaaleaan tai kirkkaaseen: esimerkiksi laivastonsininen ja kulta, metsänvihreä ja kerma tai hiilenharmaa ja lime. Vaaleusero pitää muodot luettavina favicon-koossa ja harmaasävyissä, kun taas sävyero antaa tunnukselle luonteen. Alla on kymmenen testattua paria ja kolme kolmikkoa hex-koodeilla ja kontrastisuhteilla sekä nopea oma tarkistusmenetelmä.

Miksi logoissa on niin vähän värejä

Logo on yrityksen useimmin toistettu omaisuus. Se näkyy 16 pikselin selainkuvakkeena, paidan kirjontana, kahvikupin leimana ja kuitin yksivärisenä painatuksena. Jokainen lisäväri voi epäonnistua yhdessä näistä paikoista. Siksi monet tunnetut tunnukset ovat yksivärisiä ja useimmat muut kaksivärisiä.

Aloita mustasta. Jos muoto toimii mustana valkoisella ja valkoisena mustalla, väri voi vain auttaa. Jos ei toimi, mikään yhdistelmä ei pelasta sitä. Logosuunnittelun perusteet käsittelee muotoa; tässä oletetaan sen olevan valmis.

Kymmenen kaksiväristä logoyhdistelmää

Kymmenen paria jyrkkinä jakoina, kuten värit kohtaavat tunnuksessa. Kopioi koodi painamalla värinäytettä.
Laivastonsininen ja kulta

Koodit

#14213d #fca311

Kontrasti

7,9:1

Tunnelma

Vakiintunut, varma, hieman klassinen
Metsä ja kerma

Koodit

#1b4332 #f1e9da

Kontrasti

9,2:1

Tunnelma

Luonnollinen, käsityömäinen, rauhallinen
Hiilenharmaa ja lime

Koodit

#2d2d2d #c6f432

Kontrasti

10,7:1

Tunnelma

Energinen, urheilullinen, tekninen
Luumu ja poskipuna

Koodit

#4a1942 #f7c8d0

Kontrasti

9,4:1

Tunnelma

Lämmin, kauneus, putiikki
Viininpunainen ja hiekka

Koodit

#6b0f1a #e9d8a6

Kontrasti

8,7:1

Tunnelma

Perinne, viini, vieraanvaraisuus
Muste ja oranssi

Koodit

#1c1917 #f97316

Kontrasti

6,2:1

Tunnelma

Käytännöllinen, ystävällinen, ammattityöt ja työkalut
Purppura ja minttu

Koodit

#5b21b6 #a7f3d0

Kontrasti

7,0:1

Tunnelma

Moderni, leikkisä, ohjelmistot
Koboltti ja valkoinen

Koodit

#1d4ed8 #ffffff

Kontrasti

6,7:1

Tunnelma

Selkeä, luotettava, digitaalinen
Musta ja signaalipunainen

Koodit

#111111 #e63946

Kontrasti

4,5:1

Tunnelma

Rohkea, kiireellinen, toimituksellinen
Petrooli ja koralli

Koodit

#0f766e #ff7f6e

Kontrasti

2,2:1

Tunnelma

Eloisa, mutta vain vierekkäisinä muotoina, ei tekstinä toisen päällä
PariKooditKontrastiTunnelma
Laivastonsininen ja kulta#14213d #fca3117,9:1Vakiintunut, varma, hieman klassinen
Metsä ja kerma#1b4332 #f1e9da9,2:1Luonnollinen, käsityömäinen, rauhallinen
Hiilenharmaa ja lime#2d2d2d #c6f43210,7:1Energinen, urheilullinen, tekninen
Luumu ja poskipuna#4a1942 #f7c8d09,4:1Lämmin, kauneus, putiikki
Viininpunainen ja hiekka#6b0f1a #e9d8a68,7:1Perinne, viini, vieraanvaraisuus
Muste ja oranssi#1c1917 #f973166,2:1Käytännöllinen, ystävällinen, ammattityöt ja työkalut
Purppura ja minttu#5b21b6 #a7f3d07,0:1Moderni, leikkisä, ohjelmistot
Koboltti ja valkoinen#1d4ed8 #ffffff6,7:1Selkeä, luotettava, digitaalinen
Musta ja signaalipunainen#111111 #e639464,5:1Rohkea, kiireellinen, toimituksellinen
Petrooli ja koralli#0f766e #ff7f6e2,2:1Eloisa, mutta vain vierekkäisinä muotoina, ei tekstinä toisen päällä
Parien WCAG-kontrastisuhteet. Yli 4,5:1 mahdollistaa toisen värin tekstin toisella; pienemmän kontrastin parit sopivat rinnakkaisiksi muodoiksi.

Petrooli ja koralli poikkeavat joukosta. Molemmat ovat vaaleudeltaan lähellä toisiaan, joten korallikirjaimia olisi vaikea lukea petroolin päällä ja ne muuttuisivat yhdeksi harmaaksi möhkäleeksi mustavalkopainatuksessa. Pari toimii erillisinä muotoina, kuten petroolisymbolina korallitekstilogon vieressä, kumpikin valkoisella tai tummalla pohjalla. Luvut perustuvat WCAG-kaavaan, jonka värikontrasti ja saavutettavuus selittää.

Kolmiväriset logoyhdistelmät

Kolme väriä sopii erillisistä osista tehtyyn tunnukseen: laatoista muodostuva symboli, väripisteellinen tekstilogo tai lastenbrändin muotosarja. Ankkuroi kolmikko yhdellä tummalla värillä ja valitse kaksi selvästi eri sävyä. Niiden sijoittaminen ympäri väriympyrää kolmisointuvärien tapaan vähentää kilpailua.

Aikuiset päävärit. Tumma sininen ankkuroi muuten huutavan punaisen ja keltaisen. Sopii kouluihin, urheiluun ja vanhemmille suunnattuihin leluihin.
Rannikon lämpö. Liuskepetrooli kantaa tekstilogon; sahrami ja poltettu koralli täyttävät symbolin muodot.
Digitaalinen ja äänekäs. Magenta ja syaani hehkuvat lähes mustaa ankkuria vasten musiikin, pelaamisen ja yöelämän tunnuksissa.

Logon vältettävät väriyhdistelmät

Vältä

  • Keskipunaista ja keskisinistä kosketuksissa: ne värisevät
  • Puhdasta punaista ja vihreää yhdessä: vaikea monille värisokeille
  • Keltaista tai vaaleita pastelleja valkoisella: tunnus katoaa
  • Neljää tai useampaa yhtä painavaa väriä
  • Liukuväriä logon ainoana versiona

Tee mieluummin

  • Tee toisesta parin väristä paljon tummempi
  • Erottele vaaleudella, älä pelkällä sävyllä
  • Aseta vaaleat värit tummalle pohjalle tai rajaa ääriviivalla
  • Yksi pääväri, yksi tai kaksi tukiväriä
  • Ensin tasaväriversio, liukuväri muunnelmaksi

Liukuvärilogot ovat erikoistapaus. Ne voivat näyttää upeilta suurina, mutta porrastuvat painossa ja sumentuvat pieninä. Säilytä tasaista yhtä tai kahta väriä käyttävä versio ja käsittele liukuväriä muunnelmana; liukuvärilogot selittää molempien tekemisen.

Logon väriyhdistelmän testaus

  1. 1

    Tulosta harmaasävyisenä

    Muunna logo harmaaksi. Jos molemmat värit muuttuvat samaksi harmaaksi, niiden vaaleusero on liian pieni.

  2. 2

    Pienennä 16 pikseliin

    Katso sitä selaimen välilehtikuvakkeena. Vaaleat ohuet osat katoavat ensin.

  3. 3

    Käännä tausta

    Aseta logo brändisi tummimmalle värille ja valkoiselle. Kirjaa, mikä väri pitää kummassakin vaihtaa.

  4. 4

    Tarkista värisokeus

    Käytä värisokeussimulaattoria. Punavihreät parit sulautuvat usein yleisimmissä värisokeuden muodoissa.

  5. 5

    Aseta oikealle taustalle

    Logo on harvoin pelkällä valkoisella todellisessa käytössä. Testaa valokuvalla, liukuvärillä ja levottomassa somevirrassa.

Harbour

Elävän taustan yli kulkeva tekstilogo voi menettää osia kirjaimistaan.

Harbour

Sama tekstilogo, jonka takana tausta rauhoittuu ja syvenee.

Viimeisessä kokeessa monet logot kamppailevat. Logo liukuväritaustalla käsittelee tekniikoita. Gradientlyssä Mark tietää sanojen ja logon paikan: sen rauhallisin alue siirtyy taakse ja Automaattinen muste valitsee vaalean tai tumman riveittäin Markin omasta paletista. Näin yksinkertainen kaksivärinen logo voi olla rikkaalla taustalla ilman laatikkoa.

Pidä logo yksinkertaisena ja brändi rikkaana

Logon ei tarvitse kantaa kaikkia brändivärejä. Monet brändit pitävät tunnuksen yhdessä tai kahdessa värissä ja tuovat syvyyttä taustoihin, kuviin ja typografiaan. Jos valitset seuraavaksi laajempaa palettia, brändiväri-ideat tarjoaa 30 lähtökohtaa ja tunnetut liukuvärilogot näyttää, miten vakiintuneet brändit yhdistävät yksinkertaisen tunnuksen ilmeikkääseen väriin.

Suunnittele elävällä liukuvärillä

Julkaisuja, tarinoita, dioja ja bannereita kaikissa koissa, ja teksti pysyy aina luettavana.

Aloita suunnittelu, ilmaiseksi

Usein kysyttyä

Mikä on paras väriyhdistelmä logolle?

Yhtä parasta paria ei ole, mutta tumma väri vaalean tai kirkkaan kanssa, kuten laivastonsininen ja kulta tai metsä ja kerma, toimii lähes kaikkialla, koska muodot pysyvät erillisinä.

Montako väriä logossa pitäisi olla?

Useimmissa yksi tai kaksi. Kolme toimii erillisistä osista tehdyissä tunnuksissa, mutta jokainen lisäväri vaikeuttaa painamista ja pieniä kokoja.

Mitä värejä ei kannata käyttää yhdessä logossa?

Vältä saman vaaleuden värejä kosketuksissa, kuten keskipunaista ja keskisinistä, äläkä luota punaiseen vihreää vasten, sillä moni värisokea ei erota niitä.

Pitäisikö logon toimia mustavalkoisena?

Kyllä. Logon pitää toimia yhtenä värinä, mustana ja valkoisena, ennen värien lisäämistä, koska sitä painetaan ja leimataan yksivärisenä.

Voiko logo olla liukuväri?

Voi, mutta säilytä tasaväriversio pieniin kokoihin, kirjontaan ja yksiväripainatukseen. Käytä liukuväriä, kun sille on tilaa.

Jaa tämä opas

Kirjoittanut GradientlyVahvistettu Gradiently-tili

Gradientlyn tiimi. Gradiently on Markien ympärille rakennettu suunnittelutyökalu: eläviä liukuvärejä, joiden ansiosta kaikki suunnittelemasi näyttää omaltasi.

Katso profiilimme

Tällä sivulla

Miksi logoissa on niin vähän värejäKymmenen kaksiväristä logoyhdistelmääKolmiväriset logoyhdistelmätLogon vältettävät väriyhdistelmätLogon väriyhdistelmän testausPidä logo yksinkertaisena ja brändi rikkaana

Jaa tämä opas

Seuraavaksi aiheesta Ideat ja trendit

Kaksivärinen suunnittelu: vahva ilme kahdella värillä

Lue myös

Kaikki oppaat aiheesta Ideat ja trendit
Ideat ja trendit

Brändiväri-ideoita: 30 palettia uusille brändeille koodeineen

5 min lukuaika

Brändipaletti koostuu neljästä tai viidestä väristä, joilla on omat tehtävänsä. Tässä on 30 lähtökohtaa tunnelman ja toimialan mukaan, kopioitavat koodit ja tapa testata niitä.

Brändäys

Liukuvärilogo: milloin se toimii ja milloin valita tasainen

4 min lukuaika

Liukuväri voi saada logon tuntumaan elävältä näytöllä ja hajoamaan käyntikortissa. Näin päätät, suunnittelet kestävän logon ja teet tasaisen version, jonka tarvitset aina.

Brändäys

Logo liukuväritaustalla: näin se pysyy selkeänä

4 min lukuaika

Liukuväri vaihtaa väriä koko leveydeltään, joten toisessa päässä erottuva logo voi kadota toisessa. Näin valitset version, paikan ja värin niin, ettei niin käy.

Löydä ilme, joka on vain sinun.

Jokainen Mark on elävä tausta, jolla on yksi omistaja. Kokeile vapaata Markia ja lunasta omasi, kun se tuntuu oikealta.

Aloita suunnittelu

Tarkista sertifikaatti

Kirjoita sertifikaatin numero tai Markin koodi nähdäksesi, kuka sen omistaa.

Toimii ChatGPT:n ja Clauden kanssa

Pyydä tekoälyltäsi designia. Se tekee sen Markissasi, muokkausvalmiina.

ChatGPTClaude
Näin yhdistät

Tuote

  • Markkinat
  • Selaa
  • Hinnoittelu
  • Sertifikaatit

Opi

  • Suunnitteluopas
  • Ohjekeskus
  • Mitä uutta

Kehittäjille

  • Yleiskatsaus
  • ChatGPT ja Claude
  • API-viite
  • API-avaimet

Yritys

  • Tietoa meistä
  • Ota yhteyttä
  • Kirjaudu sisään

Juridiikka

  • Ehdot
  • Tietosuoja
  • Hyvitykset
  • Markin suoja
  • Evästeet
  • Kaikki käytännöt
Liiku kirjainten yli. Jokaisessa on oikea Mark.Kosketa kirjainta nähdäksesi sen Markin.Yksi nimi. Kymmenen Markia sen sisällä.
© 2026 Gradiently