# Juveltoner: koder för smaragd, safir, rubin och ametist [Canonical HTML page](https://gradiently.design/sv/guide/jewel-tone-colors) Smaragd, safir, rubin och ametist ser dyra ut eftersom de är djupa och mättade på en gång. Här är koderna, färgparen som håller dem rika och misstagen som får dem att se ut som en utklädnad. ## The short version - Juveltoner är djupa, starkt mättade färger uppkallade efter ädelstenar: smaragdgrön, safirblå, rubinröd, ametistlila, samt topas, citrin, granat och turmalin. - Det som gör en färg till en juveltons är kombinationen av stark mättnad och medelmörkt till mörkt värde, så att den ser upplyst inifrån ut i stället för skarp eller blek. - Juveltoner ser som rikast ut bredvid en varm neutral som elfenben, ett nästan svart, eller en liten mängd dämpat guld. - Smaragd, safir, rubin och ametist klarar alla WCAG AA-kontrast för brödtext mot vitt eller elfenben med koderna i den här artikeln. - Använd en juveltons som ledande färg och högst en till som accent, eftersom en hel uppsättning ädelstenar i lika stark nyans läses som en utklädnad. **Juveltoner** är djupa, mättade färger uppkallade efter ädelstenar: smaragd `#00674F`, safir `#0F52BA`, rubin `#9B111E` och ametist `#6A3D9A` är de fyra som alla känner igen, med topas, citrin, granat och turmalin tätt efter. De ligger i ett smalt band: mycket rikare än pastell, mörkare än neon och aldrig nedtonade som jordtoner. Den kombinationen är anledningen till att de upplevs som värdefulla, och till att de passar kvällsevenemang, vinterkampanjer, vinetiketter och varje varumärke som vill kännas substantiellt utan att gå mot svart. ## Hexkoder för juveltoner Det här är fungerande koder, justerade för att se ut som stenen på en skärm och för att hålla som text. Ädelstenar varierar, så det finns ingen enda officiell smaragd, men de här värdena ligger mitt i det folk föreställer sig. - Smaragd: #00674f - Safir: #0f52ba - Rubin: #9b111e - Ametist: #6a3d9a - Topas: #d98e04 - Citrin: #e1b000 - Granat: #6f1d2b - Turmalin: #b0185a - Turkos turmalin: #0e7c7b Nio juveltoner. De fyra första är den klassiska uppsättningen, och topas och citrin är de varma, ljusa medlemmarna i familjen. | Juveltons | Hex | RGB | Text på vitt | | --- | --- | --- | --- | | Smaragd | `#00674F` | 0, 103, 79 | 6,88:1, klarar AA | | Safir | `#0F52BA` | 15, 82, 186 | 7,15:1, klarar AAA | | Rubin | `#9B111E` | 155, 17, 30 | 8,42:1, klarar AAA | | Ametist | `#6A3D9A` | 106, 61, 154 | 7,64:1, klarar AAA | | Turkos turmalin | `#0E7C7B` | 14, 124, 123 | 5,01:1, klarar AA | | Turmalin | `#B0185A` | 176, 24, 90 | 6,72:1, klarar AA | | Topas | `#D98E04` | 217, 142, 4 | använd mörk text på den | | Citrin | `#E1B000` | 225, 176, 0 | använd mörk text på den | Kontrasten är uppmätt mot rent vitt. Topas och citrin är för ljusa för text på vitt, men bär nästan svart text väl: citrin med `#14141A` når 9,10:1. Behöver du dem i ett annat format förklarar [hexkoder för färg](https://gradiently.design/sv/guide/color-codes-explained) hur hex, RGB och HSL hänger ihop, och [hex till RGB](https://gradiently.design/sv/guide/hex-to-rgb) visar omvandlingen för hand. ## Vad som gör en färg till en juveltons Två inställningar, båda på en gång. Mättnaden är hög: färgen är ren, med nästan inget grått i sig. Värdet är medelmörkt till mörkt: det ligger långt under vitt. Höj värdet och smaragd blir mint, sänk mättnaden och den blir salvia. Behåll båda så får du glöden från ljus som passerar genom en slipad sten. ### Inte en juveltons - Mint `#98E5C8`: för ljus, en pastell - Salvia `#8A9A84`: nedtonad, en dämpad ton - Lime `#7CFF3A`: skarp och elektrisk, en neon - Skogsgrön `#1F3B2C`: så mörk att den läses som nästan svart ### Juveltons - Smaragd `#00674F`: ren grön på medelmörkt värde - Safir `#0F52BA`: mättat blått, tydligt upplyst - Rubin `#9B111E`: djupt rött som ändå glöder - Ametist `#6A3D9A`: lila med djup, inte grått Det är samma idé som [nyanser, toner och skuggor](https://gradiently.design/sv/guide/tints-tones-shades) beskriver: juveltoner är mest rena nyanser med lite svart tillsatt, sällan med vitt eller grått. De ligger också i motsatt ände från [jordtoner](https://gradiently.design/sv/guide/earth-tone-colors), som är samma nyanser dragna mot brunt. ## Färgpaletter med juveltoner som du kan använda En juveltons behöver något stilla omkring sig. Ensam är en sida i smaragd tung, men bredvid elfenben ser den avsiktlig ut. De här fyra paletterna leds var och en av en sten och lägger till stöd i rätt proportion. - **Smaragdbiblioteket:** smaragd `#00674F`, elfenben `#F6EFE2`, dämpat guld `#C9A24A`, bläck `#14141A`. Klassiskt, bokligt, bra för förlag och barer. - **Safirnatt:** safir `#0F52BA`, midnatt `#0B1430`, pärla `#EEF0F5`, citrin `#E1B000` som liten accent. Lugnt och självsäkert. - **Rubinmiddag:** rubin `#9B111E`, granat `#6F1D2B`, grädde `#F4EADB`, oliv `#5E6B3A`. Varmt, generöst, gjort för mat och vin. - **Ametistateljé:** ametist `#6A3D9A`, plommon `#3B1F4F`, linne `#F2ECE4`, turkos turmalin `#0E7C7B`. Kreativt och lite oväntat. Använd [60-30-10-regeln](https://gradiently.design/sv/guide/60-30-10-rule) som första fördelning: neutralen täcker det mesta av ytan, juveltonen tar de stora formerna och accenten får en skärva. Guld fungerar bäst dämpat, och ett skarpt gulaktigt guld bredvid smaragd ser snabbt ut som en utklädnad. ## Gradienter i juveltoner Juveltoner ger några av de rikaste gradienter som finns, eftersom var och en kan tona ut i sin egen skugga utan att bli lerig. Håll grannarna nära varandra på färghjulet och låt en mörk botten göra det mesta av jobbet. - Smaragddjup: `radial-gradient(circle at 30% 25%, #10a37f 0%, #00674f 40%, #052a22 85%)` - Safirens uppgång: `linear-gradient(150deg, #0b1430 0%, #0f52ba 60%, #4f86e6 100%)` - Rubinglöd: `radial-gradient(circle at 70% 30%, #d4243a 0%, #9b111e 40%, #3a0710 90%)` - Ametist till turmalin: `linear-gradient(160deg, #1e0f33 0%, #6a3d9a 55%, #b0185a 100%)` - Smaragd till safir: `linear-gradient(135deg, #00674f 0%, #0e7c7b 50%, #0f52ba 100%)` - Citrin över granat: `radial-gradient(circle at 50% 20%, #e1b000 0%, #d98e04 30%, #6f1d2b 95%)` Sex gradienter i juveltoner. Var och en håller sig inom närliggande nyanser, så att mitten av övergången förblir ren. Undvik att blanda rubin rakt in i smaragd. De är komplementfärger, så mittpunkten blir brun. [Leriga gradienter](https://gradiently.design/sv/guide/muddy-gradients) förklarar varför och hur du går runt det via en tredje färg eller en mörk botten. ## Där juveltoner fungerar bäst Juveltoner har tyngd, så de passar tillfällen som ska kännas genomtänkta: en inbjudan, en säsongsmeny, ett omslag till en årsredovisning, en lansering av något som kostar riktiga pengar. Sätt texten i elfenben eller en blek ton av samma nyans och håll layouten sparsam. En stående inbjudan till en vintermiddag med blek text på en djup, rik bakgrund En inbjudan i 5×7 tum vid 1500×2100. En djup botten med blek text är juveltonernas klassiska drag. Ett stående inlägg för sociala medier som tillkännager en begränsad produkt i rubinutgåva på en djup färgad bakgrund Ett Instagram-inlägg i 1080×1350 för en begränsad produkt, där en sten sätter stämningen. Många varumärken famlar efter juveltoner på hösten och vintern, och det är precis därför en säsongskampanj lätt flyter ihop med allas andra. Vill du ha rikedomen utan likheten ger en Gradiently Mark dig en bakgrund i juveltoner som bara du kan exportera med när du har säkrat den, och den håller dina ord läsbara var de än står. ## Vanliga misstag med juveltoner - **Fyra stenar i full styrka.** Smaragd, safir, rubin och ametist tillsammans ser ut som en godisask. Välj en ledare. - **Att para med rent vitt.** Det ger kontrast men ser kliniskt ut. Ett varmt elfenben får färgen att se djupare ut. - **Ljusa juveltoner under vit text.** Citrin och topas behöver mörk text, och vitt på citrin klarar inte kontrasten alls. - **Att trycka utan provtryck.** Mättade blå och lila färger hamnar ofta utanför CMYK-området och blir matta på papper. Läs [RGB eller CMYK](https://gradiently.design/sv/guide/rgb-vs-cmyk) innan du skickar en fil. ## FAQ ### Vad är juveltoner? Juveltoner är djupa, mättade färger uppkallade efter ädelstenar, som smaragdgrön, safirblå, rubinröd och ametistlila. De kombinerar stark mättnad med medelmörkt till mörkt värde. ### Vad är hexkoden för smaragdgrön? En bra smaragd i juveltoner är `#00674F`. Ljusare smaragder som `#50C878` är vanliga på webben, men de läses som en skarp mellangrön snarare än som en ädelsten. ### Vilka färger passar till juveltoner? Varma neutraler som elfenben och grädde, nästan svart och små mängder dämpat guld. En juveltons ser oftast bäst ut med högst en annan juveltons, använd som accent. ### Vad skiljer juveltoner från jordtoner? Juveltoner är rena och mättade, jordtoner är samma nyanser dragna mot brunt och grått. Smaragd är en juveltons, oliv är en jordton. ### Passar juveltoner för ett varumärke? De passar varumärken som vill kännas rika, etablerade eller festliga, som hotell och restaurang, förlag och premiumvaror. Välj en sten som ledare och behåll gott om neutralt utrymme runt den.