Adott szín azonosítása egy alkalmazásban vagy webhelyen

Képzelje el, hogy a képek között görget, és megtalálja a tökéletes színt – pontosan azt az árnyalatot, amelyre szüksége van a következő tervezési projekthez. Van néhány nagyszerű eszköz az interneten, amelyek segítenek azonosítani a színeket bármely alkalmazásban vagy webhelyen. Vessünk egy pillantást a legjobb lehetőségek közül néhányra.

1. A Fejlesztői eszközök használata a Chrome webböngészőben

Az egyik lehetőség, amelyet kipróbálhat, a Chrome Developer eszköz. A Chrome számos hasznos funkcióval rendelkezik a fejlesztők számára, így a feladatok sokkal könnyebben elvégezhetők. A következő lépésekkel azonosíthatja a színeket bármely alkalmazásban vagy webhelyen.

• Nyissa meg azt a webhelyet, amelyen színt szeretne azonosítani a Chrome böngészőben
• Kattintson a hárompontos ikonra a Chrome jobb felső sarkában. Megjelenik egy felugró ablak egy csomó opcióval.
• Kattintson a „További eszközök” elemre, majd a megjelenő felugró ablakban válassza a „Fejlesztői eszközök” lehetőséget.
• Használja a Ctrl + Shift + I billentyűket, ha ki szeretné hagyni a fenti lépéseket
• Most az ablak két képernyőre oszlik – balra a webhelyre, jobbra pedig a webhely kódjára
• Írja be a Ctrl + Shift + C billentyűkombinációt a billentyűzeten. Ez megmutatja a webhely egy adott elemének összes részletét, amikor az egérmutatót az elemekre helyezzük.
• Megtalálhatja az elem színkódját és egyéb hasznos információkat.

Példa

Tegyük fel, hogy érdekli az alábbi webhely egyes elemeinek színkódja:

A fejlesztői eszközöket a képernyő sarkában található három pontra kattintva választhatja ki. A legördülő menüben válassza a További eszközök, majd a Fejlesztői eszközök lehetőséget.

A képernyő vizuálisan két oldalra lesz osztva. A webhely bal oldalon, a webhely kódja pedig a jobb oldalon látható.

Írja be a parancsot és a „Ctrl + Shift + C” gyorsbillentyűt, és vigye az egérmutatót a webhely elemei fölé. Ez megmutatja az adott elem színét, valamint egyéb hasznos információkat. Az alábbiakban két példa látható, ahol megtaláljuk a navigációs sáv és a keresőeszköz alatti irányítópult színét.

Itt megtaláljuk a színkódot a navigációs sáv előugró ablakában. A színkód: #333333.

A műszerfal színe más hasznos részletekkel együtt megtalálható. Szín: #333333, Háttérszín: #5D4A8E. Bár az elején kissé ijesztőnek tűnhet, a program használata sokkal könnyebbé válik egy kis gyakorlással.

2. Szemcseppentő króm hosszabbító

Az Eye Dropper egy népszerű és széles körben használt Chrome-bővítmény, amely segít bizonyos színek megtalálásában bármely webhelyen vagy alkalmazásban.

Kövesse az alábbi lépéseket, hogy az Eye Dropper bővítőeszköz segítségével azonosítson bizonyos színeket egy webhelyen vagy alkalmazásban.

• Nyissa meg bármelyik webhelyet vagy alkalmazást a Chrome webböngészőben
• Kattintson az Eye Dropper kiterjesztés ikonjára
• Válassza a „Szín kiválasztása a weboldalról” lehetőséget, és vigye az egérmutatót az alkalmazás vagy a webhely különböző elemeire.

A felsorolt ​​elemek színkódját a weboldal jobb alsó sarkában találja.

Példa

Oké, használjuk a szemcseppentő hosszabbító eszközt egy valós példában. Kezdjük azzal, hogy megnyitunk egy webhelyet, és megnyomjuk az Eye Dropper kiterjesztés ikonját

Ha a kurzort a webhely különböző elemeire viszi, láthatja, hogy a színkódok megjelennek a képernyő jobb alsó sarkában található részben.

Amikor a kurzort a V-alakú ikonra viszem, az alsó ablakban látom annak színkódját, ahogy már említettük. Ennek az eszköznek az az előnye, hogy az RGB kódot is megtalálja az elem hexadecimális színkódja mellett. A módszer rugalmasan használható azok számára, akik egyszerű és gyors módot szeretnének megtalálni kedvenc színeik kódjait.