CDRN

Aqbad il-kulur ta' pixel ta' immaġni

  • Dashboard
  • Dokumentazzjoni
  • API
jirkupra l-kulur eżatt ta' pixel mill-immaġni tiegħek (RGB, HSL, eżadeċimali) billi tikklikkja fuq il-punt magħżul

X'inhu picker tal-kulur tal-immaġni?

Apicker tal-kulur (bil-Franċiż pipetta tal-kulur jew qbid tal-kulur) hija għodda li tirrestawra l-valur eżatt ta 'pixel magħżul fuq immaġni. Int ittella’ ritratt, int ikklikkja fuq il-punt li inti interessat fih, u l-għodda tirritorna l-kulur preċiż fil-forma HEX, RGB u HSL. Huwa l-ekwivalenti tal-web tal-eyedropper fis-softwer tad-disinn bħal Photoshop, GIMP jew Figma.

L-għodda tagħna taħdem direttament fil-browser tiegħek. Inti ittella 'l-immaġni tiegħek, hija murija fil-paġna, u għandek sempliċement tikklikkja fuq pixel biex tirkupra l-kulur tiegħu. Qari tal-pixel isir fuq in-naħa tal-klijent permezz tal-API tal-kanvas, mingħajr vjaġġi bir-ritorn tas-server, mingħajr rikompressjoni u mingħajr ma jintbagħat l-immaġni fuq in-netwerk għall-għażla.

Differenza ma 'estrattur tal-kulur

L-l-estrattur tal-kulur tagħna u l-picker tal-kulur tagħna jwieġbu tnejn ħtiġijiet distinti, li huwa utli li jiġu distinti b'mod ċar:

  • L-estrattur janalizza l-immaġni kollha u jirritorna l-paletta dominanti (il-5, 8 jew 10 sfumaturi l-aktar rappreżentati). Hija l-għodda tal-għażla għas-sintetizzazzjoni tal-atmosfera kolorimetriku ta' ritratt, toħloq mood board jew ssostni charter.
  • Il-picker tal-kulur jirritorna l-kulur eżatt ta’ pixel speċifiku li inti innominat. Hija l-għodda tal-għażla meta tkun taf fejn tfittex: logo f'qabda, sfumatura gradjent preċiż, wallpaper ta 'referenza.

L-estrattur jaħdem fuq miljuni ta 'pixels u japplika clustering biex joħroġ gruppi kuluri; il-picker biss jaqra l-valur RGB maħżun fil-pożizzjoni li tikklikkja. Il- l-ewwel jiġġeneralizza, it-tieni huwa kirurġiku.

Kif taħdem, teknikament

Immaġini diġitali hija grilja ta 'pixels, kull pixel iġorr tliet kanali RGB (aħmar, aħdar, blu) ġeneralment kodifikati fuq 8 bits, jew 256 valuri għal kull kanal. Meta tikklikkja fuq punt, l-għodda:

  1. Jiġbed l-immaġni tiegħek f'element tal-kanvas, filwaqt li jżomm id-dimensjonijiet indiġeni tiegħu (b'limitu massimu 1500 pixel wiesa 'biex tibqa' komda fuq l-iskrin).
  2. Jikkonverti l-pożizzjoni tal-ikklikkja f'koordinati tal-immaġini indiġeni, li jikkumpensaw għat-tibdil tad-daqs wiri tal-browser.
  3. Aqra l-valur RGBA tal-pixel permezz tal-API canvas.getContext('2d').getImageData(x, y, 1, 1).
  4. Juri preview tal-picker tal-kulur. Fuq is-sottomissjoni, is-server jaqra l-istess pożizzjoni mal-PHP GD u tikkalkula l-kodiċi finali HEX, RGB u HSL.

Il-valur HSL huwa kkalkulat mis-servizz tagħna ta 'konverżjoni tal-kulur, l-istess bħal dak użat minn tagħna konvertitur tal-kulur. Konsistenza tarf sa tarf, ikollok l-istess valuri daqs li kieku ttajpjat il-kodiċi HEX fil-konvertitur.

Każijiet ta' użu tipiċi

  • Ipproduċi kulur ta' screenshot: għandek screenshot ta' sit, inti trid taqbel mal-kulur eżatt ta' buttuna jew sfond. Il-picker jagħtik il-kodiċi HEX preċiż biex tippejstja fis-CSS tiegħek.
  • Identifika kulur taċ-ċart f'ritratt: PDF ta' preżentazzjoni, paġna ta' rivista, prodott viżwali. M'hemmx bżonn li titlob għall-grafika aktar, inti taqra l-kulur direttament.
  • Inġinerija inversa tal-identità viżiva: tinqabad il-blu eżatt ta' logo, ir-roża ta’ banner, l-oranġjo ta’ sejħa għall-azzjoni.
  • Monitoraġġ tal-ispirazzjoni u tad-disinn: tara ritratt li tixtieq, ikollok id-dell eżatt ta’ fjura, ħajt, poster.
  • Debug front-end: screenshot tal-bug turi kulur mhux korrett, taqra il-valur attwali biex jitqabbel ma 'dak mistenni fil-mudell.
  • Ħolqien ta' paletta minn referenza: inti tagħżel diversi punti minn a istess immaġni biex tinħoloq paletta personalizzata.

Kif tuża l-picker tal-kulur

  1. Ttella' l-immaġni tiegħek (PNG, JPG, GIF, BMP, WebP, sa 20 MB).
  2. Preview hija murija fuq il-paġna. Ikklikkja fuq pixel biex tirkupra l-kulur tiegħu.
  3. Viewfinder jimmarka l-pożizzjoni kklikkjata u ħdejha tidher preview tal-kulur.
  4. Ivvalida bil-buttuna issottometti biex tikseb ir-riżultat finali: kodiċi ikkulurit kwadru, HEX, RGB u HSL.
  5. Biex tittrasforma l-valur bejn il-formati, uża tagħna konvertitur tal-kulur.

Mistoqsijiet frekwenti

X'inhi d-differenza bejn HEX, RGB u HSL?

Dawn huma tliet rappreżentazzjonijiet tal-istess kulur. HEX (#ff0000) huwa l- l-aktar format użat fis-CSS. RGB jesprimi t-tliet kanali aħmar / aħdar / blu ġewwa valuri 0-255. HSL(Hue, Saturation, Lightness) huwa aktar intuwittiv biex taġġusta a lewn: dan huwa l-format preferut meta trid tiskura, tiddisatura jew timmodifika a kulur mingħajr ma tinbidel l-isfumatura bażi.

Għaliex il-klikk tiegħi ma tirritornax eżattament il-kulur mistenni?

Fuq żona gradjent, żewġ pixels ġirien jista 'jkollhom valuri differenti ħafna. Barra minn hekk, L-immaġini JPG huma kkompressati b'telf: il-kulur ta 'pixel jista' jvarja xi ftit minn l-oriġinal. Għal kodiċijiet tal-kulur affidabbli, ippreferi PNGs jew immaġini mhux kompressati.

Il-koordinati tiegħi huma mill-iskrin jew mill-immaġni?

Dawk tal-immaġni oriġinali. L-iskrittura JavaScript tagħna awtomatikament tikkonverti l-pożizzjoni tal-ikklikkja (f'pixels tal-iskrin) għall-pożizzjoni fl-immaġni nattiva. Jekk l-immaġni tiegħek hija 4000x3000 u dan jintwera f'800x600, meta tikklikkja fiċ-ċentru terġa' lura (2000, 1500) u mhux (400, 300).

Il-picker jaħdem bi stampi trasparenti?

Iva. Jekk tikklikkja fuq pixel trasparenti, tirkupra l-kulur RGB maħżun hemmhekk (spiss abjad jew iswed skond il-pubblikatur oriġinali). It-trasparenza nnifisha (kanal alfa) ma jiġix ritornat fir-riżultat; Biex tanalizza kanal alfa, iftaħ l-immaġni f'a editur tal-grafika.

X'daqs ta' immaġini huwa aċċettat?

Sa 20 MB, PNG, JPG, GIF, BMP u formati WebP. Immaġini kbar ħafna jintwerew f'1500 pixels wiesgħa massimu biex jibqgħu komdi fuq l-iskrin, iżda l-kulur jinqara jibqa 'dak tal- pixel oriġinali, mingħajr kampjunar mill-ġdid.

L-immaġini tiegħi huma maħżuna fuq is-server?

Le. L-għażla ssir fil-browser tiegħek. Fil-ħin tas-sottomissjoni, il-fajl jiġi pproċessat fuq il-fly biex tikkonferma l-kulur tal-pixel mitlub, allura l-fajl temporanju jitħassar. L-ebda immaġni ma hija maħżuna, indiċjata jew kondiviża.

X'jiġri jekk JavaScript jiġi diżattivat?

Is-sottomissjoni tal-formola klassika tibqa' possibbli. Il-koordinati x u y huma ġestiti minn oqsma moħbija li JavaScript jimla fuq ikklikkja. Mingħajr JavaScript, dawn l-oqsma jibqgħu vojta u l- formola se tirrapporta li pożizzjoni hija nieqsa, iżda l-immaġni nnifisha tiġi trażmessa lill- server għall-ipproċessar.

Eżempju ta' talba

curl -X POST https://cdrn.fr/api/v1/tools/color-picker/execute \
  -F "image=@/path/to/file" \
  -F "x=..." \
  -F "y=..."

Skema ta' input

Kamp Tip Meħtieġ Default
image file ✓ –
x string – –
y string – –

din l-għodda tistenna fajl - uża Content-Type multipart/form-data minflok application/json

Endpoints

  • GET https://cdrn.fr/api/v1/tools - telenka l-għodod kollha disponibbli
  • GET https://cdrn.fr/api/v1/tools/color-picker - tikseb l-iskema ta' din l-għodda
  • POST https://cdrn.fr/api/v1/tools/color-picker/execute - teżegwixxi din l-għodda b'payload JSON