Svart och guld gradient: lyxkoder med god smak

En gradient i svart och guld ställer en nästan svart botten mot guld som är byggt av flera stopp i stället för en platt färg: ett mörkt brons som #8a6d1f, ett varmt guld som #d4af37 och en blek högdager som #f3e5ab. Den variationen får guld att läsas som metall. Smakfulla versioner använder också mycket mindre guld än du kanske tror, ofta bara en glöd i ena kanten eller själva texten. Här är koderna, CSS för metallisk guldtext och reglerna som får paret att kännas dyrt.

Varför platt guld ser billigt ut

Guld är egentligen ingen färg, det är ett material. Det du känner igen som guld är ett mönster av reflexer: mörkt olivbrunt i skuggorna, varmt gult i mellantonerna, nästan vitt där ljuset träffar. Ett enda hexvärde fångar bara en av dem, så ett platt #ffd700 läses som gult eller senap snarare än metall. En gradient med minst tre stopp gör det jobb som ljuset skulle göra.

Koder för metalliska guldgradienter

Det här är själva guldfyllningarna: för en linje, ett märke, ett monogram eller gradienttext. Var och en går från mörkt till ljust till mörkt, vilket ger intrycket av en böjd, polerad yta som fångar ljus.

Bakgrunder i svart och guld

För en bakgrund vänder du på proportionerna: det svarta gör nästan hela jobbet och guldet kommer som en glöd, en horisont eller en svag värme i ett hörn. Ett varmt svart, med en ton av brunt, sitter bättre ihop med guld än ett rent eller blåsvart.

Mörka gradienter får fler ränder än någon annan sort, och en guldglöd på svart är nästan värsta fallet. Ett fint kornlager löser det och får dessutom ytan att kännas som papper eller sammet. Fler bottnar finns i svarta gradienter.

Så håller du svart och guld smakfullt

Återhållsamhet är hela knepet. Lyxförpackningar visar ofta mycket tom mörk yta och en liten mängd metall, så att metallen känns värdefull. Detsamma gäller på skärmen. Lyxiga färgpaletter och lyxdesign går igenom det bredare formspråket.

Guldtext på en svart gradient

Guld läses bra på svart. Siffrorna nedan använder WCAG:s kontrastformel, där 4,5:1 är det vanliga minimet för liten text och 3:1 för stora rubriker. Spara de mörkare antika gulden till linjer och kantlinjer, inte till ord.

Metallisk gradienttext fungerar för ett enskilt ord eller ett kort namn. CSS:en nedan klipper den polerade guldgradienten till bokstäverna och behåller en enfärgad guldreserv. CSS-gradienttext tar upp tillgänglighetssidan.

.luxe {
  background-color: #0a0a0a;
  background-image: radial-gradient(circle at 80% 15%, #5c4813 0%, #1a1408 35%, #0a0a0a 75%);
  color: #f3e5ab;
}

.luxe h1 {
  color: #d4af37; /* fallback */
  background: linear-gradient(135deg, #8a6d1f 0%, #d4af37 30%, #f3e5ab 50%, #d4af37 70%, #8a6d1f 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 0.04em;
}

Svart och guld i tryck

Vanligt fyrfärgstryck kan inte återge metall. En guldgradient tryckt i CMYK blir en brunaktig gul, hur noggrant du än bygger den. För inbjudningar, visitkort och förpackningar där guldet spelar roll, använd varmfolie eller metallfärg till guldpartierna och spara gradienten för skärmen. Gradienter i tryck förklarar alternativen, och RGB mot CMYK förklarar varför skärmar och papper skiljer sig.

Var du använder svart och guld

Svart och guld passar smycken, klockor, parfym, sprit, hotell, barberare, kvällar med mörk kostym och nyår. Det fungerar också bra med djupa vinröda toner, se vinröda gradienter. Vill du ha ett mörkt, varmt utseende som bara är ditt är en Gradiently Mark ett recept av färger, material, ljus och korn snarare än en platt fyllning. Varje Mark har en ägare åt gången, och när du har säkrat en kan en konkurrent inte exportera den.