#CD853F · Color Code Generator & Picker

Generer farvekoder, variationer, harmonier, og tjek kontrastforhold.

Farvekonvertering

#cd853f

Variationer

Formålet med denne sektion er at præcist producere nuancer (rent hvidt tilføjet) og toner (rent sort tilføjet) af din valgte farve i 10% trin.

Pro Tip: Brug toner til hover-tilstande og skygger, nuancer til highlights og baggrunde.

Toner

Mørkere variationer skabt ved at tilføje sort til din basisfarve.

Nuancer

Lysere variationer skabt ved at tilføje hvid til din basisfarve.

Almindelige anvendelsestilfælde

  • • UI-komponenttilstande (hover, aktiv, deaktiveret)
  • • Skabe dybde med skygger og highlights
  • • Bygge konsistente farvesystemer

Designsystem Tip

Disse variationer danner grundlaget for en sammenhængende farvepalette. Eksporter dem for at opretholde konsistens i hele dit projekt.

Farvekombinationer

Hver harmoni har sin egen stemning. Brug harmonier til at brainstorme farvekombinationer, der fungerer godt sammen.

Sådan bruger du

Klik på en hvilken som helst farve for at kopiere dens hex-værdi. Disse kombinationer er matematisk bevist til at skabe visuel harmoni.

Hvorfor det er vigtigt

Farveharmonier skaber balance og fremkalder specifikke følelser i dine designs.

Komplementær

En farve og dens modsatte på farvehjulet, +180 grader af nuance. Høj kontrast.

Bedst til: Høj-impact designs, CTA'er, logoer

Split-komplementær

En farve og to tilstødende til dens komplement, +/-30 grader af nuance fra værdien modsat hovedfarven. Fed som en lige komplementær, men mere alsidig.

Bedst til: Livlige men afbalancerede layouts

Triadisk

Tre farver jævnt fordelt langs farvehjulet, hver 120 grader af nuance fra hinanden. Bedst at lade én farve dominere og bruge de andre som accenter.

Bedst til: Legende, energiske designs

Analoge

Tre farver med samme luminans og mætning med nuancer, der er tilstødende på farvehjulet, 30 grader fra hinanden. Glidende overgange.

Bedst til: Naturinspirerede, beroligende interfaces

Monokromatisk

Tre farver med samme nuance med luminansværdier +/-50%. Subtilt og raffineret.

Bedst til: Minimalistiske, sofistikerede designs

Tetradisk

To sæt komplementære farver, adskilt af 60 graders farvetone.

Bedst til: Rige, mangfoldige farveskemaer

Farveteori principper

Balance

Brug én dominerende farve, støt med sekundære, og brug accenter sparsomt.

Kontrast

Sørg for tilstrækkelig kontrast for læsbarhed og tilgængelighed.

Harmoni

Farverne skal arbejde sammen for at skabe en samlet visuel oplevelse.

Farvekontrastkontrol

Test farvekombinationer for at sikre, at de opfylder WCAG-tilgængelighedsstandarder for tekstlæsbarhed.

Kontrast

1.00
common.contrastFail
Meget dårlig
Lille tekst
common.contrastFail
Stor tekst
common.contrastFail

WCAG-standarder

AA:Mindste kontrastforhold på 4.5:1 for normal tekst og 3:1 for stor tekst. Krævet for de fleste websites.
AAA:Forbedret kontrastforhold på 7:1 for normal tekst og 4.5:1 for stor tekst. Anbefalet for optimal tilgængelighed.
Utilstrækkelig kontrast for alle tekststørrelser - opfylder ikke WCAG-standarder.

Avanceret kontrastkontrol

Finjuster med skyder, flere forhåndsvisninger & mere

Alle er et geni. Men hvis du bedømmer en fisk på dens evne til at klatre i et træ, vil den leve hele sit liv i troen på, at den er dum.

contrastChecker.quote1Author

Tekniske formater

Udforsk avancerede farverumsrepræsentationer og professionelle farvemodeller brugt i videoproduktion, fotografering, videnskabelige applikationer og farvestyringssystemer. Disse tekniske formater giver præcise farvespecifikationer til specialiserede industrier og applikationer.

Praktiske formater

Konverter farver til praktiske formater til virkelige anvendelser, herunder printsimulering, LED-skærme, terminaloutput og dataindkodning. Disse formater hjælper dig med at implementere farver på tværs af forskellige medier, platforme og fysiske enheder.

Farveanalyse

Analyser farveegenskaber med avancerede metrikker, herunder spektral sammensætning, farverenhed, metamerismeeffekter og perceptuelle karakteristika. Disse værktøjer giver dyb indsigt i farveadfærd og udseende under forskellige betragtningsforhold.

Blindhedssimulator

Tjek hvordan en farve opfattes af personer med forskellige typer farveblindhed for at skabe mere tilgængelige designs. Forståelse af farveopfattelse hjælper med at sikre, at dit indhold er tilgængeligt for alle.

Kreative aspekter

Udforsk de kunstneriske og psykologiske dimensioner af farver, herunder sæsonbestemte associationer, følelsesmæssig påvirkning, naturlige forekomster, historiske pigmenter og farveblandingsopskrifter til kreative anvendelser.