Dominante kleur van afbeelding
Vind de dominante kleur van elke afbeelding en een palet met de meest voorkomende kleuren. De tool groepeert elke zichtbare pixel in 4096 kleurvakken, geeft het vak met de meeste pixels op als dominante kleur, toont maximaal 12 paletkleuren met hun aandeel in de afbeelding en voegt de gemiddelde kleur toe. Elke kleur wordt weergegeven als hex, RGB en HSL. Handig voor ontwerpers, themabouwers en ontwikkelaars die tijdelijke of accentkleuren nodig hebben.
Veelgestelde vragen
Hoe wordt de dominante kleur bepaald?
Elke pixel wordt ingedeeld in een van 4096 vakken, met 16 niveaus voor rood, groen en blauw. Het vak met de meeste pixels wint. De kleur ervan is het gemiddelde van de pixels erin, zodat een witte achtergrond als zuiver wit wordt weergegeven in plaats van als een afgeronde waarde.
Wat is het palet?
Het palet toont de meest voorkomende vakken na het dominante vak, tot het aantal kleuren dat u kiest: van 1 tot 12, standaard 5. Elke regel toont de hex-, RGB- en HSL-waarden en het aandeel zichtbare pixels dat de kleur beslaat.
Waarin verschilt de gemiddelde kleur?
De gemiddelde kleur is het gemiddelde van alle zichtbare pixels. Een foto van een blauwe lucht boven een rood veld heeft blauw of rood als dominante kleur, maar het gemiddelde is een troebele mix van beide. Het gemiddelde werkt goed voor onscherpe tijdelijke afbeeldingen, terwijl de dominante kleur geschikt is voor accenten.
Hoe worden transparante pixels verwerkt?
Pixels die voor meer dan de helft transparant zijn, worden genegeerd. Zo geeft een logo op een transparante achtergrond de logokleuren weer in plaats van zwart. Het resultaat vermeldt welk deel van de afbeelding transparant was. Een afbeelding zonder zichtbare pixels geeft een melding in plaats van een kleur.
Welke indelingen kan ik analyseren?
Afbeeldingen in JPEG, PNG, GIF, WebP, TIFF en AVIF tot 5 MB worden ondersteund. Bij geanimeerde GIF- en WebP-bestanden wordt het eerste frame gemeten. CMYK-afbeeldingen worden vóór het tellen omgezet naar sRGB.
Worden grote afbeeldingen eerst verkleind?
Afbeeldingen met een zijde van meer dan 4000 pixels worden verkleind tot 4000 pixels voordat de pixels worden geteld. Hierdoor veranderen de aandelen hooguit een heel klein beetje. Kleinere afbeeldingen worden pixel voor pixel geteld.
Waarom verschijnen vergelijkbare tinten als afzonderlijke kleuren?
De vakken zijn 16 niveaus breed, dus twee tinten aan weerszijden van een vakgrens worden afzonderlijk geteld. Daarom bevat het palet bij kleurovergangen en foto's vaak aangrenzende tinten. Verhoog het aantal paletkleuren om er meer te zien.
Kan ik de kleuren gebruiken in CSS?
Ja. Elke kleur is beschikbaar als hex-code, zoals #3366cc, als rgb()-waarden en als hsl()-waarden, met de tint in graden en de verzadiging en lichtheid in procenten. U kunt ze direct plakken in CSS, ontwerptools of thema-instellingen.
Waarvoor kan ik de dominante kleur gebruiken?
Veelvoorkomende toepassingen zijn tijdelijke achtergrondkleuren terwijl afbeeldingen laden, accentkleuren voor kaarten en kopteksten die bij een omslagafbeelding passen, productenfoto's sorteren op kleur en controleren of merkafbeeldingen binnen het kleurenpalet blijven. Dankzij het gestructureerde resultaat zijn de waarden ook eenvoudig opnieuw te gebruiken in scripts en thema's.
Is het resultaat elke keer hetzelfde?
Ja. Het tellen is deterministisch, dus hetzelfde bestand geeft altijd dezelfde dominante kleur, hetzelfde palet en dezelfde aandelen. Als twee vakken precies evenveel pixels bevatten, wordt de volgorde bepaald door de volgorde waarin hun kleuren voor het eerst voorkomen.