Pasirinkite spalvą, pasiimkite kodą ir grįžkite prie darbo

Spalvų parinkiklis, gradientų kūrimas ir paveikslėlių pipetė viename puslapyje. Be paskyros, be diegimo ir be laukimo: pasirinkite atspalvį ir nukopijuokite jį kaip HEX, RGB, HSL arba HSV.

%
Atverti spalvos puslapį

Spalvos kodai

HEX#0F37FF
RGBrgb(15, 55, 255)
HSLhsl(230°, 100%, 52.94%)
HSVhsv(230°, 94.12%, 100%)
CMYKcmyk(94.12%, 78.43%, 0%, 0%)
XYZxyz(19.61, 10.05, 95.5)
LABlab(37.93, 62.96, -98.45)
LCHlch(37.93, 116.86, 302.6°)

Populiarios spalvos

Žiūrėti visas populiarias spalvas
#A5E3FE
#8E1025
#65E76F
#046B8B
#C37B3C
#C02148
#B5A9D0
#F29C8C
#2C3F44
#F04777
#3B89B0
#7CD0B2

Kas viduje

Pipetė

Imkite spalvas iš įkelto paveikslėlio arba iš bet ko ekrane ten, kur naršyklė tai leidžia. Numeskite failą ant puslapio ir spustelėkite pikselį.

Formatų keitimas

Akimirksniu perjunkite tarp HEX, RGB, HSL, HSV, CMYK, XYZ, LAB ir LCH ir kopijuokite bet kurią reikšmę tiesiai į CSS ar į savo dizaino įrankį.

Gradientų kūrimas

Pridėkite ir vilkite stoteles juostoje, perjunkite tiesinį ir spindulinį, nustatykite kampą bei nepermatomumą ir nukopijuokite baigtą CSS.

Spalvų istorija

Kiekviena jūsų sukurta spalva ir gradientas lieka naršyklėje, kad galėtumėte prie jų grįžti vėliau ar panaudoti kitame projekte.

Darnos ir atmainos

Kiekviename spalvos puslapyje yra šviesesni ir tamsesni atspalviai bei šešios darnos schemos, ir bet kurią iš jų vienu spustelėjimu paverčia gradientu.

Nemokama ir privatu

Jokios mokamos sienos ir jokio sekimo, ką renkatės. Įkelti paveikslėliai skaitomi naršyklėje ir niekur nekeliauja.

Kam tai skirta

Dizaineriams ir produktų komandoms
Kai eskizuojama sąsaja ar prekės ženklo paletė, bandomi deriniai ir kopijuojamas tikslus gradiento CSS.
Iliustracijai ir tapybai
Spalvoms iš nuotraukų ir paveikslų imti pipete bei švelniems perėjimams planuoti.
Front-end kūrimui
Nuosekliems spalvų dydžiams per visą projektą kurti ir jiems nuskaityti iš esamo dizaino.
Prieinamumo tikrinimui
Spalvai palyginti skirtinguose modeliuose ir jai koreguoti, kol kontrasto santykis peržengs reikiamą ribą.

Kaip naudotis

  1. 1

    Pasirinkite spalvą

    Spustelėkite bet kur sodrumo lauke, tada patikslinkite atspalvio ir permatomumo šliaužikliais. HEX, RGB ir HSV atsinaujina eigoje.

  2. 2

    Paimkite iš paveikslėlio

    Nuvilkite paveikslėlį ant puslapio arba pasirinkite failą, tada spustelėkite norimą pikselį. Kodai pasirodo iškart.

  3. 3

    Sudėkite gradientą

    Spustelėkite juostą, kad pridėtumėte stotelę, ir nuvilkite ją į vietą. Perjunkite tiesinį ar spindulinį ir nustatykite kampą.

  4. 4

    Nukopijuokite ir naudokite

    Nukopijuokite reikšmę arba visą CSS deklaraciją. Viskas, ką pasirenkate, savaime įrašoma į istoriją.

Dažni klausimai

Mažas įrankis, kuris nemaišo

Viskas prasidėjo kaip vidinė pagalbinė priemonė: norėjome pasiimti spalvą, ją pakoreguoti ir eiti toliau, prieš tai neatverdami sunkios dizaino programos. Tai sąmoningai vienas puslapis, sąmoningai greitas, ir jis liks nemokamas.

Naršyklės plėtiniai

Mieliau imtumėte spalvas tiesiai iš lankomų puslapių? Chrome ir Edge plėtiniai prideda pipetę į įrankių juostą, tvarko savo istoriją ir atveria šį įrankį vienu spustelėjimu.

Atverti Chrome internetinę parduotuvęAtverti Microsoft Edge priedus