
Färg
Färgteori, paletter och gradientfärger, med koder du kan kopiera.
200 guider · 11 ämnen
FärgFärglärans grunder för dig som inte är formgivare
5 minuters läsning
Du behöver ingen konstskola för att välja färger väl. Sex idéer förklarar nästan varje färgval, och var och en går att lära sig på några minuter.
FärgSå använder du en färgcirkel för att välja en palett
5 minuters läsning
Färgcirkeln är färgens äldsta verktyg och fortfarande det mest användbara. Här är hur du läser en, varför målarens cirkel och skärmens cirkel inte är överens och hur du gör den till en palett.
FärgKomplementfärger: kontrast som ändå känns balanserad
5 minuters läsning
Motsatta färger ger den starkaste kontrast som färg kan erbjuda, och den snabbaste vägen till en design som surrar eller en som skriker. Skillnaden är proportion och ljushet.
FärgAnaloga färger: den enklaste vägen till en lugn färgpalett
4 minuters läsning
Välj tre grannar i färgcirkeln så kan du knappt göra fel. Konsten är att ge dem tillräckligt med kontrast för att hålla intresset uppe, och att veta när lugnet ska brytas.
FärgTriadfärger och delad komplementfärg, förklarat
4 minuters läsning
Tre färger med jämna mellanrum kan få en palett att kännas djärv och balanserad på en gång, eller som en leksakslåda. Skillnaden handlar nästan helt om vilken färg som leder.
FärgMonokromatiskt färgschema: en nyans, en hel identitet
5 minuters läsning
En nyans låter begränsande tills du ser hur stort omfång som ryms i den. Byggd på rätt sätt kan en enda färg täcka bakgrunder, text, knappar och gradienter, och se mer särpräglad ut än en regnbåge.
FärgSå väljer du varumärkesfärger: en metod steg för steg
5 minuters läsning
Varumärkesfärger väljs, de hittas inte. En tydlig metod tar dig från ett tomt blad till en palett som är särpräglad, läsbar och fortfarande rätt om två år.
FärgFärgpsykologi: vad som är sant och vad som är myt
5 minuters läsning
Scheman som säger att rött betyder hunger och blått betyder tillit finns överallt, och är oftast för förenklade för att vara användbara. Här är en ärligare bild av vad färg gör och hur du använder den väl.
FärgFärgers betydelse i olika kulturer: en försiktig guide
5 minuters läsning
Vitt kan betyda bröllop eller begravning. Rött kan betyda fara eller lycka. Om dina designer ska resa är det här vad de viktigaste färgerna bär på olika håll, och hur du kontrollerar innan du lanserar.
FärgLila gradienter: paletter, koder och hur du använder dem
5 minuters läsning
Lila är en av de mest använda gradientfärgerna på webben, vilket gör den både ett tryggt val och lätt att försvinna i. Här är paletter som känns genomtänkta, med koderna för att använda dem.
FärgBlå gradienter: 20 paletter från is till midnatt
5 minuters läsning
Blått är den tryggaste färgen i design, och just därför ser så många blå gradienter likadana ut. Här är tjugo som inte gör det, ordnade från ljusast till mörkast, med koderna och tanken bakom dem.
FärgRosa gradienter som känns moderna, inte sockersöta
4 minuters läsning
Rosa kan se ut som en godisbutik eller ett modemagasin. Skillnaden ligger sällan i själva rosan utan i vad du sätter bredvid den. Här är paletter, kombinationer och koder för rosa som känns aktuellt.
FärgSolnedgångsgradienter: orange, korall och skymningspaletter
4 minuters läsning
De flesta solnedgångsgradienter går fel på samma ställe: mitten, där blått möter orange och blir grått. En riktig himmel gör aldrig så. Här är ordningen naturen använder, och tio paletter byggda på den.
FärgGröna gradienter: fräscha, djupa och elektriska
5 minuters läsning
Grönt kan vara en vårmorgon, en privat herrklubb eller en raveaffisch. Här är gröna gradienter för alla tre, med koder, och en väg ut ur bladgröna klichéer.
FärgSvarta gradienter: så designar du med nästan svart
6 minuters läsning
Rent svart är ett hål i skärmen. De svarta gradienter som känns exklusiva är byggda av nästan-svarta toner med lite färg i, och ett ljus som rör sig.
FärgRöd gradient: energi utan larmkänsla
5 minuters läsning
Rött får uppmärksamhet snabbare än någon annan färg, och det är just därför det går fel. Så bygger du röda gradienter som känns levande, varma och trygga i stället för högljudda.
FärgRegnbågsgradient som inte ser ut som en standardmall
5 minuters läsning
Standardregnbågen har en bländande gul rand och ett mörkblått hål. Rätta ljusheten, välj din båge, så blir spektrumet ett av de gladaste verktyg du har.
FärgFärgkontrast: läsbar text för alla
5 minuters läsning
Kontrast är skillnaden mellan ord som folk läser och ord som folk hoppar över. WCAG-siffrorna på klarspråk, hur du kontrollerar dem och vad som händer när bakgrunden är en gradient.
FärgHexkoder för färg, RGB, HSL och OKLCH förklarade
5 minuters läsning
#7c3aed, rgb(124 58 237), hsl(262 83% 58%) och oklch(54.1% 0.247 293) är samma violett. Här är vad varje skrivsätt egentligen säger, och när var och en gör nytta.
FärgFärgpalett från bild: så plockar du fram en ur ett foto
5 minuters läsning
En pipett ger dig en pixel. En palett behöver de färger du minns från bilden, i rätt proportioner. Så tar du dig från det ena till det andra.
Färg60-30-10-regeln: färgproportioner för design och varumärke
5 minuters läsning
De flesta paletter misslyckas på proportionerna, inte på valet. Tre siffror visar hur mycket av varje färg du ska använda, och de fungerar lika bra på en mobilskärm som i vardagsrummen där de kommer ifrån.
FärgVarma och kalla färger: använd temperatur med avsikt
5 minuters läsning
Varje färg har en temperatur, även dina gråa och vita. Lär dig läsa den så kan du få en design att kännas närmare, lugnare eller ljusare utan att ändra en enda nyans.