Ang screenshot ang kadalasang tanging mayroon ka. Hindi mo mabuksan ang CSS ng site, hindi mo mainspeksyon ang app, wala ka ng design file — pero nakikita mo ang mga kulay sa screen, at pini-freeze ng screenshot ang mga ito sa larawang kaya mong kunan ng sample. Narito kung paano kumuha ng eksaktong color code mula sa isa.
Bakit ang screenshot ang tapat na pinagmulan

Kapag na-screenshot mo ang na-render na page o app, kinukuha mo ang mga kulay gaya ng aktwal na hitsura nila — pagkatapos ilapat ang bawat gradient, overlay, at opacity. Iyon ay kadalasang mas totoo kaysa sa source na value. Ang card na tinukoy bilang #000000 sa 90% opacity sa ibabaw ng kulay-abong background ay hindi itim sa screen; ito ay isang partikular na madilim na kulay-abo. Ang pag-inspeksyon sa code ay nagbibigay sa iyo ng recipe; ang pagkuha ng sample sa screenshot ay nagbibigay sa iyo ng kulay na talagang nakikita ng user. Kapag tumutugma ka sa itsurang iyon, ang screenshot ang gusto mong basahin.
Kumuha ng kulay sa tatlong hakbang

- Kunan at i-load ang screenshot. Kunan ang screen (o ang rehiyong gusto mo) at ihulog ang larawan sa picker.
- I-hover sa pixel. Sumusunod sa iyong cursor ang isang magnifier loupe at pinapalaki ang lugar sa ilalim nito, kaya kaya mong dumapo nang eksakto — kahit sa manipis na border o maliit na icon.
- I-click para i-save, tapos i-copy. Ang bawat click ay pinapanatili ang kulay bilang swatch kasama ang HEX, RGB at HSL nito, bawat isa ay may copy button. Kopyahin ang format na kailangan mo at i-paste ito sa iyong stylesheet o design tool.
Mga bagay na partikular sa screenshot na dapat bantayan
May mga kakaiba ang screenshot na maaaring magpamali sa color sample, at madali itong iwasan kapag alam mo na:
- I-save bilang PNG, hindi JPEG. Ang JPEG compression ay bahagyang nagpapahid ng kulay, lalo na malapit sa gilid at sa flat na lugar, kaya ang na-sample na value ay maaaring lumihis mula sa totoo. Lossless ang PNG at pinapanatiling eksakto ang bawat pixel — karamihan ng OS screenshot tool ay default na sa PNG.
- Isaisip ang antas ng zoom. Ang screenshot na kinuha sa browser o OS zoom na iba sa 100% ay naka-scale, at ang pag-scale ay pinagsasama ang mga karatig na pixel. Para sa pinakamalinis na sample, kunan sa 100%.
- Iwasan ang mga gilid at teksto. Ang anti-aliasing ay nangangahulugang ang mga pixel sa gilid ay pinaghalo, hindi ang totoong kulay. Kumuha ng sample mula sa gitna ng solidong lugar — tumutulong ang loupe na makita mong malayo ka sa malabong hangganan.
- Bantayan ang subpixel na kulay ng teksto. Mag-zoom sa na-render na teksto at makikita mo ang mga gilid ng kulay na hindi totoong value ng teksto. Kumuha ng kulay mula sa fill at background, hindi mula sa stroke ng letra.
Pagbasa ng HEX, RGB at HSL
Bawat swatch ay nagpapakita ng lahat ng tatlong format nang sabay:
- HEX (
#3A7BD5) — ang default para sa CSS at design tool. - RGB (
rgb(58, 123, 213)) — mga value ng channel, madaling gamitin kapag kailangan mo ngrgbana transparency. - HSL (
hsl(215, 65%, 53%)) — hue, saturation, lightness, pinakamainam kapag gusto mong ayusin ang kulay sa halip na kopyahin ito nang eksakto.
Hindi ka muling kumukuha ng sample para lumipat — ang parehong kulay ay nariyan na sa lahat ng tatlo.
Kunin ang buong scheme sa isang pass
Mula sa isang screenshot ay kaya mong muling itayo ang buong color scheme: i-click ang kulay ng header, ang button, ang link, ang background, ang mahinang teksto. Ang bawat isa ay nagpapatong-patong sa listahan kaya kaya mong kunin ang buong set sa isang session at kopyahin ang mga ito sa pagkakasunod.
Kung sa halip ay gusto mo ang kabuuang palette ng larawan na binuod para sa iyo — ang iilang nangingibabaw na tono — iyon ay hiwalay na trabaho, at awtomatikong kinukuha ng palette tool ng img.diy ang mga ito. Ang picker na ito ay para sa pagturo sa partikular na pixel sa screenshot; ang palette tool ay para sa paglalarawan ng larawan bilang isang buo.
Walang umaalis sa iyong makina
Ang mga screenshot ay madalas na naglalaman ng mga bagay na mas ayaw mong i-upload — isang internal na dashboard, pribadong draft, hindi pa inilalabas na UI ng kliyente. Dito ay binabasa ang larawan nang lokal sa iyong browser mula sa canvas: walang naipapadala kahit saan, walang account, at gumagana ito offline pagkatapos ng unang load. Nakukuha mo ang mga kulay nang hindi kailanman umaalis ang screenshot sa iyong device.
Kunan ang screenshot, i-hover sa pixel, i-click, at i-copy.
