Kleurkiezer uit afbeelding — Ontvang HEX- en RGB-kleurcodes

Upload een JPG, PNG, WebP of GIF en klik ergens op de weergegeven afbeelding. De exacte pixel onder uw cursor wordt bemonsterd en weergegeven als HEX, RGB en HSL met één klik kopiëren voor elk formaat. Handig om de kleur van een merk te matchen, een staal van een foto te nemen of accenttonen uit een ontwerpmockup te halen.

Klik op een willekeurige pixel en deze kleurkiezer toont de HEX-kleurcode (bijvoorbeeld #FF6B35) naast RGB en HSL — dezelfde HTML/CSS-kleurcodes die je rechtstreeks in een stylesheet, designtoken of HTML-attribuut plakt. Klik op Kopiëren om de hex-code met één klik te pakken.

De afbeelding wordt verkleind tot 320 pixels aan de langste zijde, waarna elke pixel wordt ingedeeld op basis van de bovenste 4 bits per kanaal. De best gevulde groepen worden gemiddeld naar volledige 8-bitskleur, gesorteerd op frequentie en als jouw palet teruggegeven. Het resultaat bestaat doorgaans uit 5-24 dominante kleuren die de afbeelding visueel samenvatten.

Ja. De downloadknoppen leveren twee formaten op: een CSS-variabelenblok dat klaar is om in een :root-selector te plakken (--color-1, --color-2…), en een JSON-bestand met hex, RGB-componenten en gewichtspercentage voor elke kleur. Beide formaten integreren naadloos in designtokens, Tailwind-configuraties en paletbibliotheken.

Nee — het kiezen van kleuren en het extraheren van paletten gebeurt volledig in je browser via de HTML-canvas-API. De afbeelding blijft op je apparaat, waardoor de tool veilig is voor nog niet uitgebrachte productfoto's, conceptmock-ups en merkmateriaal onder geheimhouding.

Voor huisstijlwerk is 5-8 kleuren het ideale aantal — het vat het dominante thema zonder de accentkeuzes te verwateren. Voor datavisualisatie raden we 10-16 kleuren aan, zodat je voldoende categorische tinten hebt. Met de schuifregelaar kies je tussen 5 en 24.

Pixels met een alpha onder 128 worden genegeerd, zodat transparante achtergronden het palet niet vervuilen met "achtergrondkleuren". Daardoor is de Afbeeldingskleurkiezer bij uitstek geschikt voor uitgeknipte producten, stickerontwerpen en geïsoleerde onderwerpen.

HEX (#RRGGBB) is het compactst en is wat CSS, Figma en Sketch standaard gebruiken. RGB toont de drie componentwaarden van 0-255 — handig wanneer je programmatisch met beeldgegevens werkt. HSL (tint, verzadiging, helderheid) is intuïtief voor het aanpassen van kleuren: verschuif de tint om de kleurfamilie te wijzigen, pas de helderheid aan voor lichtere en donkerdere tinten.

Ja. Het draait in de browser en heeft geen account nodig. U hoeft niets te installeren en er is geen limiet op het aantal paletten dat u inspecteert.

Geen afbeelding nodig. De kleurkiezer en het wiel bovenaan werken op zichzelf: versleep het vierkant voor verzadiging/helderheid en de schuifregelaar voor tint, of typ een HEX-, RGB- of HSL-waarde om een ​​exacte kleur in te stellen. Het uploaden van een afbeelding is optioneel, alleen om kleuren uit een foto te laten vallen.

Kies uw basiskleur en het paneel Kleurharmonieën bouwt onmiddellijk complementaire, analoge, triadische, split-complementaire, tetradische en monochromatische schema's op met behulp van de kleurenwieltheorie. Klik op een staal om de HEX-code te kopiëren.

In de losstaande Kleurkiezer en Kleurwiel stelt u uw kleur in en toont het paneel de contrastverhouding ten opzichte van puur wit en puur zwart, samen met de WCAG-beoordeling — AAA, AA, AA Large of Fail. Gebruik dit voordat u een tekst- of knopkleur definitief maakt, zodat deze leesbaar blijft en voldoet aan de toegankelijkheidsrichtlijnen van WCAG 2.1.

Ja. De standalone Color Picker & Wheel toont de dichtstbijzijnde overeenkomende benoemde CSS-kleur naast de HEX-, RGB- of HSL-waarde die je hebt ingesteld, wat handig is om een tint snel te beschrijven in een briefing, ticket of designspecificatie zonder te gokken.

Klik op Willekeurig in de Kleurkiezer & Kleurenwiel om naar een nieuwe kleur te springen, en gebruik dan het paneel Kleurharmonieën eronder om complementaire, analoge, triadische en andere afgestemde paletten te zien die op die kleur zijn gebaseerd — een snelle manier om een startpunt te vinden wanneer je vanaf nul ontwerpt in plaats van een bestaande afbeelding te bemonsteren.

Gebruik de dropdown Formaat boven het palet om 5, 8, 10, 16 of 24 dominante kleuren te kiezen — het palet herberekent direct wanneer je het wijzigt. Combineer een klein formaat zoals 5 voor een strak merkpalet met de kleurenpipet om een of twee exacte accenttinten te pakken die de automatische extractie mogelijk zou wegmiddelen.

Ja — de zelfstandige Kleurkiezer & wiel toont het contrastverhouding van je huidige kleur ten opzichte van zuiver wit en zuiver zwart direct onder het staal, gelabeld AAA, AA, AA Large of Fail volgens de WCAG-drempels (7:1, 4.5:1, 3:1). Gebruik het om te controleren of een tekst-/achtergrondcombinatie aan de toegankelijkheidsnormen voldoet voordat je een ontwerpkleur vastlegt.

De kleurenkiezer en het kleurenwiel koppelen elke kleur die je instelt — via de kiezer, het HEX-vak of de RGB/HSL-velden — automatisch aan de dichtstbijzijnde standaard-CSS-kleurnaam, weergegeven als 'Dichtstbijzijnde naam' naast het kleurstaal. Het is een snelle manier om een kleur mondeling te beschrijven of het dichtstbijzijnde web-veilige equivalent te vinden.

Ja — elke klik of tik op de geüploade afbeelding voegt een nieuw staal toe aan je lijst Gekozen kleuren in plaats van de vorige te vervangen, zodat je een eigen set exacte pixelkleuren uit verschillende delen van een foto kunt opbouwen. Verwijder een afzonderlijk staal met de bijbehorende ×-knop, of wis de hele lijst met Gekozen wissen.

Ja — de knop Willekeurig (shuffle-pictogram) in de Kleurkiezer & wiel springt met één klik naar een nieuwe combinatie van tint, verzadiging en helderheid, handig om een creatieve blokkade te doorbreken of een palet te verkennen dat je niet handmatig had ingetypt. HEX, RGB, HSL en de harmoniestalen eronder worden allemaal samen bijgewerkt.

Op een touchscreen sleep je je vinger over de afbeelding om de kleur eronder in een live zwevend staal te bekijken en til je je vinger op om die exacte pixel toe te voegen aan je lijst met Gekozen kleuren — geen aparte bevestigingstik nodig. Dezelfde vervolgkeuzelijst voor paletgrootte en exportknoppen werken op mobiel op precies dezelfde manier.

Ja. Het kleurenwiel bovenaan de pagina heeft een knop Willekeurig die naar een willekeurige kleur springt en direct de HEX-, RGB- en HSL-codes toont, de dichtstbijzijnde benoemde kleur, contrastverhoudingen op wit en zwart, en volledige harmoniesets — complementair, analoog, triadisch, gesplitst complementair, tetradisch en monochroom. Het is een snelle manier om startpunten voor een palet te verkennen.

Deze tool haalt kleuren uit een geüploade afbeelding of van het ingebouwde kleurenwiel, in plaats van je scherm live uit te lezen. De snelste oplossing voor een schermkleurpicker: maak een screenshot, sleep het op de pagina en klik op precies de pixel die je wilt — je krijgt dezelfde HEX-, RGB- en HSL-codes zonder een extensie te installeren, en de screenshot verlaat je browser nooit.

Ja – Pixoate ondersteunt batch- en bulkverwerking. Schakel over naar de batchmodus, voeg tot 60 afbeeldingen toe op Premium of 200 op Pro, stel uw opties één keer in en elke afbeelding wordt met dezelfde instellingen verwerkt voordat u één spreadsheet downloadt: een paletrij per afbeelding. Bulkverwerking is een Premium-functie; de uitvoer gebruikt dezelfde kwaliteit en instellingen als de enkele modus.

Ja – bij bulkverwerking configureert u de instellingen één keer en ze zijn van toepassing op elk item in de batch – tot 60 afbeeldingen op Premium of 200 op Pro. Het is niet nodig om de instellingen per item te herhalen en de paletextractie draait in uw browser; alleen het voltooide spreadsheet wordt opgeslagen om te downloaden.

Bijna altijd een van de drie dingen. Het bestand heeft de gratis uploadlimiet van 20 MB overschreden: Premium neemt 50 MB in beslag en Pro 120 MB. Het formaat wordt niet door deze tool geaccepteerd, dus controleer de lijst die wordt weergegeven in het uploadpaneel. Of het bestand heeft niet echt het formaat dat de naam aangeeft: het hernoemen van een bestand verandert niets aan wat erin staat, en dat is de reden dat een geldig uitziende afbeelding wordt geweigerd.

Het rapporteert wat er werkelijk in het bestand staat, dus een leeg of verrassend resultaat betekent meestal dat de gegevens er nooit waren: verwijderd door de app die ze het laatst heeft opgeslagen, verwijderd door een platform bij het uploaden, of afwezig in het origineel. Probeer het onaangeroerde originele bestand rechtstreeks van de camera of bron in plaats van een kopie via een berichten-app.

Color Picker supports free standard use within the published processing allowances. Free downloads are clean — no watermark. No signup is required for standard tool use. Photo effects and AI edits have a web-size limit on Free, with the original-resolution result available through Premium or one credit. Crop, resize, rotate, compress and convert stay full size. Premium supports batches of up to 60 files, with the applicable plan limits shown before processing.

Nee — Color Picker draait in de browser op desktop en telefoon. Er is niets om te installeren, geen proefversie om te starten en geen licentie om te kopen voordat je kunt zien of het doet wat je nodig hebt. Probeer het op het bestand waar je daadwerkelijk mee vastzit in plaats van een voorbeeldbestand.