A Color Picker pixelpontos színpipetta eszközt biztosít színek kiválasztásához egy weboldal bármely eleméről — szövegből, háttérből, képekből, gradiensekből vagy bármely látható pixelről. Egyszerre kapja meg a pontos színértéket HEX, RGB és HSL formátumban, egy nagyított pixelelőnézettel a precíz célzáshoz. A korábban kiválasztott színek egy előzménysávban maradnak elérhetők a gyors visszakereséshez.
Egy weboldalról pontos színértékek kinyerése gyakori feladat — legyen szó márkaszín egyeztetéséről, egy design referenciáról vagy egy konkurens oldalon használt árnyalat ellenőrzéséről. A böngésző fejlesztői eszközei a Styles panelen mutatják a színeket, de csak azoknál az elemeknél, amelyeknek explicit CSS színtulajdonságuk van — nem képeknél, gradienseknél vagy örökölt színeknél. A Color Picker színpipetta pixelszinten működik — beolvassa a kurzor alatti pixel tényleges megjelenített színét, függetlenül attól, hogyan keletkezett az a szín. Kattintson egy kék égboltra egy hero képen, egy gradiens középpontjára vagy egy félig átlátszó overlay-re, és megkapja a pontos összetett színértéket. A nagyított előnézeti kör közelről mutatja a környező pixeleket, így pontosan célozhatja meg a kívánt pixelt. Mindhárom formátum-kimenet (HEX, RGB, HSL) egyszerre jelenik meg — kattintson bármelyik formátumra a másoláshoz. Az utoljára kiválasztott néhány szín egy színelőzmény-sávban marad az alján, így könnyen visszatérhet egy korábban kiválasztott színhez.
Egy nagyított, kör alakú előnézet mutatja a kurzor körüli nagyított pixeleket, szálkeresztes célzással a pontos pixelkiválasztáshoz. Válasszon színeket szövegből, háttérből, képekből, gradiensekből, SVG-kből vagy bármely látható pixelből az oldalon.
Minden kiválasztott szín mindhárom formátumban egyszerre jelenik meg: HEX (#7c3aed), RGB (rgb(124, 58, 237)) és HSL (hsl(262, 83%, 58%)). Nincs szükség váltásra vagy konvertálásra — minden formátum azonnal elérhető.
Kattintson bármely formátumsorra (HEX, RGB vagy HSL) az adott érték azonnali vágólapra másolásához. Egy rövid "Másolva!" animáció megerősíti a műveletet. Illessze be közvetlenül a CSS-ébe, design eszközébe vagy színspecifikációjába.
A legutóbb kiválasztott színei egy vizuális előzménysávban maradnak, színmintákat mutatva. Kattintson bármely mintára az adott szín újbóli kiválasztásához és értékeinek megtekintéséhez. Az előzmények megmaradnak a munkamenet alatt — válasszon színeket több oldalról is.
A kiválasztott szín nagy mintaként jelenik meg a formátumértékek felett, így könnyen látható és ellenőrizhető a szín. A minta elég nagy ahhoz, hogy megmutassa azokat a finom árnyalatokat, amelyek kisebb méretben azonosnak tűnhetnek.
Színt választ bármely látható pixelből: CSS színekből, CSS gradiensekből, képekből (PNG, JPG, SVG), canvas elemekből, videókockákból, félig átlátszó overlay-ekből (az összetett szín kiválasztásával), sőt iframe-ekből is. Ha látja, ki is választhatja.
Válassza ki a pontos márkaszínt egy cég weboldaláról, hogy biztosítsa, a designja vagy tartalma a megfelelő árnyalatot használja. Kapja meg a pontos HEX-értéket ahelyett, hogy szemmértékre hagyatkozna vagy a márkairányelveket böngészné.
Válasszon színeket közvetlenül hero képekből, termékfotókból vagy illusztrációkból. Nyerjen ki egy domináns színt egy fotóból, hogy kiegészítő háttérszínként használja a designjában.
A design specifikáció szerint a gombnak #7c3aed színűnek kell lennie. Válassza ki a színt a megvalósított gombról az egyezés ellenőrzéséhez. Elfogja azokat a finom színeltéréseket, amelyek szabad szemmel láthatatlanok.
Böngésszen design inspirációs oldalakon, és válassza ki a szemet gyönyörködtető színeket. Az előzménysáv felépíti a munkamenet alatt kiválasztott színek palettáját — használja kiindulópontként a saját színsémájához.
Válasszon színeket egy CSS-gradiens különböző pontjain, hogy lássa a pontos színt minden pozícióban. Hasznos gradiensek reprodukálásához vagy a gradiens-megállók közötti átmenet megértéséhez.
Nyissa meg a DevSuite Pro lebegő dokkját, és kattintson a Color Picker ikonra. A kurzor színpipettára változik, egy nagyított előnézeti körrel.
Mozgassa a kurzort az oldal fölött. A nagyított előnézet közelről mutatja a kurzor körüli pixeleket, egy szálkereszttel jelölve a pontos célpixelt.
Kattintson bárhová az oldalon az adott pixel színének kiválasztásához. A színminta, valamint a HEX, RGB és HSL értékek azonnal frissülnek.
Kattintson a HEX, RGB vagy HSL sorra az adott érték vágólapra másolásához. Rövid ideig megjelenik egy "Másolva!" megerősítés.
Folytassa a kattintást további színek kiválasztásához. Minden kiválasztás bekerül az előzménysávba. Kattintson bármely előzményi mintára az adott szín visszahívásához.
Telepítse ingyen a DevSuite Pro-t, és oldjon fel 64+ fejlesztői eszközt böngészőjéhez.
