A PixelVault szín- és képelemzője palettákat, hisztogramokat és kontrasztinformációt nyer ki bármely képből, teljes egészében a böngésződben. Adj hozzá egy fotót, egy illusztrációt vagy egy képernyőképet, és azonnal megkapod a domináns színeket másolható hexadecimális kódokként, kiegészítve az egyes színek által elfoglalt aránnyal. Ez egy gyors módja annak, hogy palettát nyerj ki egy tetsző képből anélkül, hogy bármit telepítenél vagy feltöltenéd a fájlodat.
A domináns színekből kiegészítő, analóg, triád és monokróm harmóniákat generálhatsz egy összefüggő séma felépítéséhez, és az egész palettát exportálhatod sima HEX-ként, CSS-változókként, SCSS-változókként, JSON-ként vagy egy Tailwind-konfigurációként — készen arra, hogy közvetlenül a projektedbe illeszd. A mélyebb elemzéshez az RGB- és fényességi hisztogramok feltárják az expozíciót és a tonális egyensúlyt, egy szürkeárnyalatos előnézet megmutatja, hogyan olvasódik egy kép szín nélkül, a WCAG-kontrasztellenőrző pedig megmondja, hogy egy szöveg és háttér párja megfelel-e az AA és AAA szinteknek az akadálymentesség érdekében.
Hogyan működik
A PixelVault csökkentett felbontáson mintavételezi a képet, és csoportosítja a hasonló színeket, hogy megtalálja a dominánsakat, színterek között alakít át a harmóniák felépítéséhez, és pixelértékeket olvas a hisztogramok kiszámításához. A kontrasztarányok a WCAG 2.1 relatív fényesség képletét használják. Minden a böngésződbe már betöltött pixeleken fut.
Miért fontos a helyi feldolgozás
A helyi elemzés a hálózaton kívül tartja a képeidet — ügyfélmunkákat, kiadatlan terveket, privát fotókat. Nincs feltöltés, és nincs szerver, amely másolatot őrizhetne meg, és az eredmények azonnaliak, mert a pixelek már az oldalon vannak.
Támogatott formátumok
- JPG — Közvetlenül elemezve.
- PNG — Az átlátszóság tiszteletben tartva a színmintavételezésnél.
- WebP — Teljes támogatás.
Gyakori felhasználások
- Nyerj ki egy színpalettát egy fotóból vagy egy tervezési referenciából.
- Generálj összeillő színsémákat egy márkához vagy felülethez.
- Ellenőrizd a szöveg és a háttér közötti kontrasztot az akadálymentesség érdekében.
- Vizsgáld meg az expozíciót és a tónust RGB- és fényességi hisztogramokkal.