Zo gebruik je Kleurkiezer voor afbeeldingen
- 1
Open een afbeelding
Sleep een screenshot, foto of logo van maximaal 25 MB naar de pagina, kies het bestand of plak het – JPG, PNG, WebP, AVIF, HEIC, GIF of SVG.
- 2
Richt met het vergrootglas
Beweeg of sleep over de afbeelding. Een loep van 11 × 11 pixels toont de exacte pixel onder het richtkruis en de bijbehorende HEX-code.
- 3
Klik om te kiezen
Je krijgt de waarden HEX, RGB, HSL en OKLCH, elk met een eigen kopieerknop. Met de pijltjestoetsen verplaats je het richtkruis en met Enter kies je de kleur.
- 4
Pak het palet
Kies 5 tot 12 dominante kleuren en kopieer ze als CSS-variabelen, JSON of een Tailwind-themablok.
Limieten en Pro
Eén afbeelding tegelijk, tot 25 MB, met onbeperkt veel gekozen kleuren, 5–12 paletkleuren en een geschiedenis van 24 kleuren.
Met Pro kun je afbeeldingen tot 4 GB uitlezen. Pro bekijken
Over Kleurkiezer voor afbeeldingen
De kleurkiezer voor afbeeldingen leest de exacte waarde van elke pixel in een afbeelding uit en maakt van de hele afbeelding een palet. Elke gekozen kleur krijg je in vier notaties: HEX voor ontwerptools, rgb() en hsl() voor CSS, en oklch() voor modern kleurgebruik in CSS, waarbij lichtheid en chroma zich gedragen zoals het oog verwacht. Je keuzes komen in een geschiedenis van de laatste 24 kleuren, die in deze browser bewaard blijft, zodat ze er de volgende keer nog zijn. In Chrome en Edge op desktop kun je met Kiezen van het scherm ook elke kleur buiten de pagina bepalen via de pipet van de browser.
Het palet wordt berekend met k-means-clustering in de OKLab-kleurruimte, op een kopie van de afbeelding die is verkleind tot maximaal 200 pixels aan de lange zijde. Vergelijkbare clusters worden samengevoegd, transparante pixels worden genegeerd en de kleuren worden gesorteerd op het deel van de afbeelding dat ze beslaan. Dat aandeel staat bij elk kleurvlak. Dezelfde afbeelding geeft altijd hetzelfde palet.
Ontwerpers gebruiken de tool om een merkkleur uit een logo over te nemen, een thema uit een foto op te bouwen, de exacte kleur van een knop in een screenshot te controleren of een moodboard samen te stellen. De waarden zijn standaard sRGB, zoals je browser de afbeelding weergeeft. Een JPG-artefact of een bron met een breed kleurbereik kan een gekozen kleur daarom een paar eenheden laten afwijken van het oorspronkelijke ontwerpbestand. Half doorzichtige pixels geven hun kleur zonder transparantie weer, en de tool geeft kleuren geen naam en controleert geen contrastverhoudingen.
Privacy
De afbeelding wordt in dit tabblad gedecodeerd en uitgelezen en de palet-clustering draait in een kleine Web Worker die pas wordt aangemaakt nadat je de afbeelding opent. Er wordt niets geüpload. Je kleurgeschiedenis wordt alleen in de lokale opslag van deze browser bewaard. Kiezen van het scherm gebruikt de ingebouwde pipet van je browser, die alleen de ene gekozen kleur met deze pagina deelt en verder niets.
Functies
Pixelnauwkeurige loep
Een vergrootglas van 11 × 11 pixels met toetsenbordbesturing voor precies kiezen met muis en touchscreen.
Dominant palet
5–12 kleuren via k-means in OKLab, gesorteerd op aandeel in de afbeelding.
Exports voor ontwikkelaars
Waarden in HEX, RGB, HSL en OKLCH plus CSS-variabelen, JSON of een Tailwind @theme-blok.
Kleurgeschiedenis
Je laatste 24 gekozen kleuren blijven in deze browser staan, klaar om als lijst te kopiëren.