Magentagradient: elektriska koder mellan rosa och lila

En magentagradient blandar färgen mellan rosa och lila med en granne: violett för något elektriskt, orange för hetta, cyan för en cyberlook eller nästan svart för djup. Ren skärmmagenta är #ff00ff, och den är så intensiv att gradienten oftast fungerar bäst när magenta är ena änden av blandningen snarare än hela den. Koderna nedan täcker varje riktning, med anmärkningar om text och om hur magenta beter sig i tryck.

Magenta, rosa och lila: var gränsen går

På HSL-färghjulet ligger magenta på 300 grader, precis mellan rött och blått. Glid mot rött och den blir stark rosa, glid mot blått och den blir lila och sedan violett. Magenta är också känd för att inte finnas i regnbågen: det finns ingen enskild våglängd för den, och ögat uppfattar den när det får rött och blått ljus samtidigt. Det är en del av varför den ser så konstgjord och elektrisk ut.

Om det du egentligen vill ha är mjukare och varmare, närmare tuggummi eller ros än neon, är samlingen rosa gradient en bättre startpunkt. Magenta förtjänar sin plats när du vill ha en färg som ingen kan scrolla förbi.

Koder för elektrisk magentagradient

Magenta till violett eller blått är det klassiska elektriska paret. Det rör sig längs färghjulet utan att korsa något grumligt, så blandningen förblir levande hela vägen. De passar musik, nattliv, spel och kreativa verktyg. Vill du ha den här riktningen med mer blått än magenta tar koderna för lila gradient över.

Koder för het magenta och solnedgång

Vrid åt andra hållet runt hjulet och magenta blir varmare: genom stark rosa till korall och orange. Det är looken hos grafik från slutet av åttiotalet, synthwave och vaporwave, och hos många sommarfestivalaffischer. Ett mörkt toppstopp gör den till en skymning. Vaporwave-färger går djupare in i den världen.

Djup magenta på mörka bakgrunder

Magenta ser dyrast ut när den glöder fram ur mörker i stället för att fylla bilden. En vin- eller plommonfärgad botten med ett enda magentaljus läses som lyxmode eller en bar sent på natten, men spridd över en hel affisch läses samma magenta som en rabattblaska. Mörka bottnar ger också vit text ett enkelt hem.

Magenta på skärm jämfört med i tryck

Skärmmagenta består av ljus, medan tryckt magenta är bläck, en av de fyra processfärgerna i CMYK. Processmagenta är mycket mindre intensiv och visas på skärm oftast som ungefär #ec008c. En magentagradient som glöder på din bildskärm kan därför se platt och rosaaktig ut på ett flygblad. RGB mot CMYK förklarar skillnaden, och gradienter i tryck tar upp provtryck.

Text på en magentagradient

Magenta är ljusare än den ser ut. Vit text på ren #ff00ff når bara ungefär 3,1 till 1 i kontrast, vilket duger för stora rubriker men inte för liten text. Svart på samma magenta når ungefär 6,7 till 1, men känns tungt. I praktiken sätter du vit text på gradientens djupare ände, eller mörkar magentan bakom små ord till något som #a3006f.

På webbplatser ger magenta också en slagkraftig gradientrubrik. Håll den till stora displaystorlekar, där kontrasten håller, som beskrivs i CSS-gradienttext.

.headline {
  font-size: clamp(2.5rem, 6vw, 5rem);
  background: linear-gradient(90deg, #ff00ff 0%, #6a00f4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

Högljudda färger är precis där en bakgrund som svarar på dina ord hjälper mest. I Gradiently fördjupar en magenta Mark färgen nära bokstäverna och behåller sin lugnaste del bakom rubriken, så att glöden finns kvar och orden ändå går att läsa. För magentans svalare syskon, se koderna för cyangradient.