Marinblå gradient: mörka, pålitliga koder

En marinblå gradient blandar djupa blå nyanser, vanligen från ett nästan svart marinblått som #0b1630 upp till ett ljusare kungsblått eller indigo. Den läses som lugn, seriös och pålitlig, och den får vit text att se skarp ut. Problemet är att marinblått finns överallt inom finans, juridik och företagsdesign, så en platt marinblå gradient ser ofta ut som en standardinställning. Koderna nedan ger marinblått ljus, temperatur och en accent, så att det behåller förtroendet och får en personlighet.

Koder för klassiska marinblå gradienter

Det här är de pålitliga, nära rent marinblått, med precis tillräckligt med rörelse för att inte se ut som en helfärgad yta. De är idealiska för presentationsbilder, årsredovisningar, e-posthuvuden och webbplatsers sidfötter.

Marinblå gradienter med ett lyft av färg

Låt marinblått luta några grader mot violett så blir det kväll och lyx; låt det luta mot blågrönt så blir det havet och tekniken. Båda förskjutningarna får det att kännas valt. Den ljusare änden ska ändå vara djup nog för vit text över det mesta av ytan.

Marinblått och guld, koppar eller silver

Få bottnar passar en metallisk accent bättre än marinblått. Guld på marinblått är traditionellt och festligt; koppar är varmare och modernare; silver är svalt och tyst. Håll metallen liten, som ett ljus i ett hörn eller en tunn linje, så att marinblått fortfarande gör det mesta av jobbet. Guldgradienter och silvergradienter visar den metalliska sidan i detalj.

Midnattsmarinblå gradienter för natt och lyx

Radiella gradienter känns som en himmel efter solnedgången eller ett svagt upplyst rum. De passar galainbjudningar, hotellbarer, smycken, klockor och sena radioprogram. För den stjärnklara versionen, se gradienter med nattsky.

Där marinblå gradienter förtjänar sin plats

Marinblått är som bäst där orden betyder mer än bilden, eftersom det ger typografin en lugn botten med hög kontrast. Några användningar värda att låna:

• Presentationsbilder i 1920×1080: ”Klassiskt marinblått” till avsnittsavdelare, med en guldlinje under varje titel.
• LinkedIn-profilbanner i 1584×396: ”Marin och blågrönt” från vänster till höger, mörkast bakom ditt foto.
• E-posthuvud i 1200×600: ”Bläckmarin” med en rubrik i elfenben, så att huvudet redan hör hemma i inkorgar med mörkt läge.
• Examens- och prisinbjudningar: ”Guldljus på marinblått” tryckt som en A5-flyer.
• Diagram och dashboards: en djupt marinblå botten gör klara datafärger lätta att skilja åt.

Så får du marinblått att se mindre företagsmässigt ut

Ingen av de här ändringarna kostar förtroende. De gör bara varumärket igenkännbart med en blick, vilket spelar roll när alla konkurrenter använder samma blå. Särpräglade varumärkesmaterial förklarar varför igenkänning kommer av att äga något som ingen annan använder. Ett användbart test: täck över din logotyp och fråga om någon ändå kan se att designen är din. Med en platt marinblå gradient är svaret nästan alltid nej.

CSS för marinblå gradient utan bandning

Mörka, subtila gradienter är där bandning syns mest: du ser synliga steg i stället för en jämn gradient, särskilt efter att en plattform komprimerat om din bild. På webben döljer några extra stopp och ett kornlager det. Bandning i gradienter förklarar orsaken.

.hero-navy {
  position: relative;
  background-color: #0b1630; /* fallback */
  background-image:
    radial-gradient(circle at 85% 15%, rgb(212 166 74 / 0.35) 0%, transparent 35%),
    linear-gradient(160deg, #1e3a8a 0%, #172554 45%, #0f1d3a 75%, #0b1630 100%);
  color: #f8f6f1;
}

/* fine grain on top to break up banding */
.hero-navy::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.08;
  background-image: url("/grain.png"); /* a small tiling noise image */
}

Text är den enkla delen med marinblått. Vitt och elfenben klarar kontrasten med god marginal på varje marinblå ovan, och gammalt guld #d4a64a läses vid ungefär 8 till 1 på midnatt, så det fungerar till rubriker. Det att se upp med är klarblått: ett mellanblått som #3b82f6 bakom vit text sjunker till ungefär 3,7 till 1. I Gradiently hanterar Auto-bläck det per rad genom att välja text ur Markens egen palett, och Designer kan lägga ut en hel marinblå kampanj i ditt varumärkespakets röst.