TL
Tool Lab
💰Donate
💰Donate

Color Picker

Pick colors and get HEX, RGB, HSL

R59
G130
B246
HEX#3B82F6
RGBrgb(59, 130, 246)
HSLhsl(217, 91%, 60%)

Om det här verktyget

Färgväljaren låter dig visuellt välja vilken färg som helst och omedelbart se dess HEX-, RGB- och HSL-representationer. Använd den inbyggda färgväljaren för breda val eller RGB-reglagen för exakt kanalstyrning.

Valda färger sparas automatiskt i historiken för senaste färger, så att du snabbt kan återvända utan att skriva om. Användbart för att jämföra färgvariationer eller bygga en palett.

Hur man använder

  1. Klicka på den stora färgbiten för att öppna webbläsarens inbyggda färgväljare och välj en färg.
  2. Dra R-, G- och B-reglagen för att finjustera enskilda färgkanaler.
  3. Klicka på Kopiera bredvid HEX, RGB eller HSL för att kopiera värdet till urklipp.
  4. Kopierade färger visas i raden Senaste färger — klicka på ett prov för att återställa det.

Användningsfall

Webbdesigners väljer exakta färger från en varumärkesguide och kopierar hex-koder till CSS. Utvecklare finjusterar RGB-värden för canvas eller WebGL. UI-designers jämför subtila variationer i samma nyans.

Vanliga frågor

  • Sparas valda färger permanent?Nej. Senaste färger lagras i komponenttillståndet och återställs när du lämnar sidan eller uppdaterar. Kopiera hex-koder till dina egna anteckningar för permanent lagring.
  • Kan jag skriva in en hex-kod direkt?Ja. Använd hex-inmatningsfältet i den inbyggda färgväljaren (tillgänglig i de flesta webbläsare) för att skriva ett hex-värde direkt.
  • Vad är HSL och varför är det användbart?HSL står för Hue (Nyans), Saturation (Mättnad) och Lightness (Ljushet). Att ändra ljushetsvärdet gör färgen ljusare eller mörkare med samma nyans, användbart för att generera tints och shades.