CodeKitHub
Myndverkfæri

Litablandari

Síðast uppfært:

Veldu tvo liti, dragðu hlutfallsrennuna og fáðu nákvæman HEX- og RGB-kóða blöndunnar — ásamt fullri stiglaræmu sem sýnir hvert þrep frá 0% til 100%, svo þú getir valið nákvæmlega þann millipunkt sem þú þarft. Gagnlegt til að finna hover- eða áherslulit sem passar eðlilega á milli tveggja vörumerkjalita.

Hvað er þetta verkfæri?

Litablandari línulega brúar milli rauða, græna og bláa rásar tveggja lita í völdu hlutfalli — sama stærðfræði og stigull notar innbyrðis. Við 0% er niðurstaðan Litur A, við 100% er hún Litur B, og við 50% er hún reiknuð meðaltal hverrar RGB-rásar.

Þetta er ólíkt því að blanda raunverulegri málningu (sem er frádráttarlegt og fer eftir litarefni), og það er ekki það sama og að meðaltala í HSL-rými — línuleg RGB-brúun er það sem CSS-stiglar, hönnunartæki og flest "litur á milli tveggja lita" verkfæri nota, þannig að niðurstaðan passar við það sem þú myndir sjá í stigli vafra á milli sömu tveggja lita.

Af hverju að nota það?

  • Finndu eðlilegan hover- eða virkjunarlit sem liggur á milli grunnlitarins þíns og áherslulits — í stað þess að giska á handahófskennda breytingu.
  • Sjáðu nákvæman HEX-kóða við hvaða hlutfall sem er, ekki bara meta skjámynd af stigli með auganu.
  • 11 þrepa stiginn gefur þér fulla litatöflu frá einum lit til annars með einum smelli, gagnlegt fyrir gagnasýn eða fjölþrepa stigul.
  • Smelltu á hvaða þrep sem er til að afrita HEX-kóða þess samstundis.
  • Ókeypis, samstundis og alveg staðbundið — engin upphleðsla, enginn reikningur.

Hvernig á að nota það

  1. Veldu Lit A og Lit B með litavölurunum eða með því að slá inn HEX-kóða.
  2. Dragðu hlutfallsrennuna til að ákveða hversu mikið af Lit B á að blanda inn.
  3. Lestu HEX- og RGB-gildin sem myndast fyrir ofan litsýnið.
  4. Smelltu á hvaða sýni sem er í 11 þrepa stiganum hér að neðan til að afrita HEX-kóða þess.

Dæmi

Inntak

Litur A #3B82F6 (blár), Litur B #F59E0B (rafgulur), hlutfall 50%

Úttak

#9B9E7D — rgb(155, 158, 125)

Við nákvæmlega 50% er hver RGB-rás reiknað meðaltal rása beggja upprunalitanna.

Algengar spurningar

Af hverju passar þetta ekki við það sem ég fengi með því að blanda alvöru málningu?

Málningarblöndun er frádráttarleg (litarefni gleypa ljós) og fer eftir tilteknum litarefnum sem um ræðir — að blanda blárri og gulri málningu gefur til dæmis grænt. Þetta verkfæri blandar ljósi (RGB-rásum) samlagslega/línulega, sem er hvernig skjáir, CSS-stiglar og flest stafræn hönnunartæki blanda litum. Kerfin tvö skila raunverulega ólíkum niðurstöðum viljandi, ekki vegna villu.

Er þetta það sama og CSS linear-gradient milli litanna tveggja?

Já — CSS linear-gradient(colorA, colorB) brúar RGB-rásir á sama hátt og þetta verkfæri gerir, þannig að liturinn sem þú myndir sjá á miðjum þeim stigli passar við 50% niðurstöðuna hér.

Af hverju lítur blandaði liturinn stundum drullulegur eða grár út?

Að blanda tveimur mettuðum en mjög ólíkum litblæjum (eins og bláum og appelsínugulum, sem eru næstum viðbótarlitir) í RGB-rými gefur oft lágmettaðan, gráleitan-brúnan millipunkt — þetta er raunverulegur eiginleiki RGB-brúunar, ekki galli. Ef þú vilt líflegri blöndu, reyndu að blanda litum sem eru nær hvor öðrum á litahjólinu, eða blandaðu í HSL-rými með því að stilla litblæ og halda mettun hárri (eitthvað sem þessi beini RGB-blandari gerir ekki).

Get ég blandað fleiri en tveimur litum í einu?

Ekki í einu þrepi — verkfærið blandar nákvæmlega tveimur litum. Til að sameina þrjá, blandaðu fyrstu tveimur í völdu hlutfalli, afritaðu niðurstöðuna og límdu hana inn sem nýjan Lit A á móti þriðja litnum þínum. Að gera þetta í áföngum gefur þér einnig stjórn á vigtun, sem einstök þriggja-vega meðaltalsreikning myndi ekki gefa.

Ætti ég að nota þetta eða Litablæ-rafalinn?

Ef þú þarft lit sem liggur á milli tveggja ólíkra lita — segjum, umbreytingarblæ á milli vörumerkjabláa þíns og rafguls áherslulitar — notaðu þennan blandara. Ef þú þarft ljósari og dekkri afbrigði af einum lit (hover-stöður, bakgrunna, Tailwind-stílaðan 50–900 stiga), notaðu Litablæ-rafalinn í staðinn: hann heldur litblæ og mettun föstum og breytir aðeins ljósleika, þannig að hver niðurstaða helst greinilega í sömu litafjölskyldu.

Hvaða litasnið get ég slegið inn í innsláttarreitina?

Textareitirnir samþykkja 6 stafa HEX-kóða, með eða án upphafs # (t.d. 3B82F6 eða #3B82F6). Styttur 3 stafa hex, rgb() ritháttur og CSS-litanöfn eru ekki þáttuð þar — en þú getur valið hvaða lit sem er sjónrænt með innbyggða litavali við hlið hvers reits, og HEX-reiturinn uppfærist til samræmis.

Tengd verkfæri