CSS
የፊት ገጽ ልማት
DevTools ሳይከፍቱ ከቀጥታ ድረ ገጽ ለCSS፣ SCSS ወይም Tailwind ቅንብር ትክክለኛ የቀለም እሴቶችን ይውሰዱ።
ለChrome ነፃ የቀለም መራጭ
ቀላል የቀለም መራጭ ለChrome ነፃ ጠብታ መምረጫ ነው። አዝራሩን ወይም Alt+P ይጫኑ፣ በማጉያው ማንኛውንም ፒክስል ያነጣጥሩና ጠቅ ያድርጉ። HEX፣ RGB ወይም HSL ኮዱ ወዲያውኑ በቅንጥብ ሰሌዳዎ ላይ ይሆናል። የመጨረሻ 50 ቀለሞችዎ በብቅ ባዩ ውስጥ ይጠብቁዎታል።
በChrome Web Store ላይ 453 ተጠቃሚዎች
በEdge፣ Brave፣ Opera እና ሌሎች በChromium የተመሠረቱ አሳሾችም ይሠራል።

በመሣሪያ አሞሌው ላይ ያለውን አዶ ጠቅ ያድርጉና ቀለም ይምረጡ ይጫኑ፤ ወይም በማንኛውም ገጽ ላይ Alt+P ይጫኑ።
ካሬ ማጉያው በጠቋሚው ዙሪያ ያለውን ቦታ ያጎላል፣ ትክክለኛውንም ፒክስል ያጥራል። ከሥሩ ያለው ናሙና HEX፣ RGB እና HSL ኮዶችን በቀጥታ ያሳያል።
ኮዱ በነባሪ ቅርጸትዎ ይቀዳል፤ አጭር ማሳወቂያም ያረጋግጣል። በCSS፣ Figma ወይም በመልእክት ውስጥ ይለጥፉት።
CSS
DevTools ሳይከፍቱ ከቀጥታ ድረ ገጽ ለCSS፣ SCSS ወይም Tailwind ቅንብር ትክክለኛ የቀለም እሴቶችን ይውሰዱ።
HEX
ከበይነገጽ፣ ከንድፍ ናሙና ወይም ከማጣቀሻ የቀለም ስብስብ ይውሰዱ፤ ገጹም ትክክለኛውን የምርት መለያ ቀለም መጠቀሙን ያረጋግጡ።
HSL
ብርሃንነትና ጥጋብን በእጅ ለማስተካከል HSL ይውሰዱ፤ ቁጥሮችን ለሚፈልግ ኮድ RGB ይጠቀሙ።
ማጉያው በጠቋሚው ዙሪያ ያሉ 11 × 11 ፒክስሎችን ያጎላል፤ መነጽሩም የሚወስዱትን ፒክስል ያጥራል። አንድ ፒክስል የሚሰፋ ድንበር ወይም አንድ የቀለም ሽግግር ደረጃ ይምረጡ።
HEX እንደ #2A6FDB፣ RGB እንደ rgb(42, 111, 219)፣ HSL እንደ hsl(217, 71%, 51%)። ነባሪውን በብቅ ባዩ ውስጥ አንድ ጊዜ ይምረጡ።
እያንዳንዱ ምርጫ ያለ ድግግሞሽ በመጨረሻ 50 ቀለሞችዎ ፍርግርግ መጀመሪያ ይጨመራል። ሦስቱንም ኮዶች ለማየትና ለመቅዳት የቀለም ናሙና ጠቅ ያድርጉ።
ብቅ ባዩን ሳይከፍቱ መምረጥ ይጀምሩ። ሌላ ቁልፍ ከፈለጉ በብቅ ባዩ ውስጥ ያለው የቁልፍ ምልክት የChrome አቋራጭ ቅንብሮችን ይከፍታል።
ሁሉም ነገር በአሳሽዎ ውስጥ ይሠራል። መለያ፣ ትንታኔ ወይም የአጠቃቀም ውሂብ ስብስብ የለም።
ብቅ ባዩና ማጉያው የስርዓትዎን ገጽታ ይከተላሉ። ገለልተኛ ግራጫቸው የሚገመግሟቸውን ቀለሞች አያዛባም።
የChrome የራሱ ጠብታ መምረጫ በDevTools ውስጥ ነው። የቅጦች ፓነሉን ይክፈቱ፣ የቀለም ባህሪ ይፈልጉ፣ ናሙናውን ከዚያም ጠብታ መምረጫውን ጠቅ ያድርጉ። ይሠራል፣ ግን ለማግኘት ብዙ ደረጃ ይፈልጋል። የተመረጠውም እሴት ወደ ቅንጥብ ሰሌዳዎ ከመሄድ ይልቅ ያንን የገጹን CSS ባህሪ ይተካል።
ቀላል የቀለም መራጭ ጠብታ መምረጫን በአንድ ጠቅታ ወይም አቋራጭ ያስከፍታል። ሲጀምሩ የሚታየውን የትሩን ክፍል ቅጽበታዊ ገጽ እይታ ይወስዳልና ካሬ ማጉያ በላዩ ይከፍታል። ትክክለኛውን ፒክስል ያያሉ፣ አማካይ ቀለም አይደለም። አንድ ጠቅታ ኮዱን ይቀዳል፤ ብቅ ባዩም ከመጨረሻ 50 ቀለሞችዎ ጋር በሦስቱም ቅርጸቶች ያስቀምጠዋል።
ከመጀመርዎ በፊት ወደሚፈልጉት የገጹ ክፍል ያሸብልሉ። ማጉያው ከዚያ ቅጽበታዊ ገጽ እይታ ያነባል። እንደ አዲስ ትር፣ ቅንብሮች እና Chrome Web Store ያሉ የአሳሹ ገጾች ለሁሉም ቅጥያዎች ዝግ ናቸው።
ቅጥያው ከአገልጋይ ጋር አይገናኝም። ትንታኔም ሆነ የአጠቃቀም ውሂብ ስብስብ የለም።
ታሪክዎና ነባሪ ቅርጸትዎ በቅጥያው አካባቢያዊ ማከማቻ ውስጥ ይኖራሉ።
መምረጥ ሲጀምሩ ብቻ ቅጽበታዊ ገጽ እይታ ለመውሰድ ንቁ ትር፤ ማጉያውን ለማሳየት ስክሪፕት ማስኬድ፤ ለታሪክና ለቅርጸት ማከማቻ፤ ኮዱን ለመቅዳት በቅንጥብ ሰሌዳ ላይ መጻፍ።
| የDevTools ጠብታ መምረጫ እና ቀላል የቀለም መራጭ | የDevTools ጠብታ መምረጫ | ቀላል የቀለም መራጭ |
|---|---|---|
| እንዴት ይጀምራሉ | DevTools ይክፈቱ፣ በቅጦች ውስጥ ቀለም ይፈልጉ፣ ናሙናውን ከዚያም ጠብታ መምረጫውን ጠቅ ያድርጉ | የመሣሪያ አሞሌ አዝራር ወይም Alt+P |
| ውጤቱ የሚሄድበት | ወደከፈቱት የCSS ባህሪ፤ ራስዎ ይቀዱታል | ጠቅ ሲያደርጉ ወደ ቅንጥብ ሰሌዳዎ |
| የቀለም ቅርጸቶች | HEX፣ RGB፣ HSL እና ሌሎች | HEX፣ RGB እና HSL |
| ከዚህ በፊት የተመረጡ ቀለሞች | አይቀመጡም | የመጨረሻ 50 ቀለሞችዎ፣ እንደገና ለመቅዳት ዝግጁ |
| ዋጋ | በChrome ውስጥ የተካተተ | ነፃ |
ቀላል የቀለም መራጭ ይጫኑ፣ በገጹ ላይ Alt+P ይጫኑ፣ ማጉያውን ወደ ቀለሙ ያነጣጥሩና ጠቅ ያድርጉ። HEX ኮዱ፣ ወይም ከመረጡ RGB ወይም HSL፣ ወደ ቅንጥብ ሰሌዳዎ ይቀዳል።
በተመሳሳይ መንገድ፦ መራጩን ያስጀምሩና በምስሉ ውስጥ የሚፈልጉትን ፒክስል ጠቅ ያድርጉ። ማጉያው ስለሚያጎላ አንድ ትክክለኛ ፒክስል መውሰድ ይችላሉ።
አዎ። ነባሪውን ቅርጸት በብቅ ባዩ ውስጥ ይምረጡ፦ HEX፣ RGB ወይም HSL። ብቅ ባዩ በታሪክዎ ላለ ማንኛውም ቀለም ሦስቱንም ቅርጸቶች ያሳያል፣ እያንዳንዱም የራሱ መቅጃ አዝራር አለው።
ብቅ ባዩን ይክፈቱ። የመጨረሻ 50 ቀለሞችዎ በናሙና መልክ፣ አዲሶቹ በፊት ይታያሉ። ኮዶቹን ለማየትና ለመቅዳት አንዱን ጠቅ ያድርጉ፣ ወይም ታሪኩን ያጽዱ።
በብቅ ባዩ ውስጥ ያለውን የአቋራጭ ቁልፍ ምልክት ጠቅ ያድርጉ። የChrome የቁልፍ ሰሌዳ አቋራጮች ገጽ ይከፈታል፤ በዚያ ሌላ ቁልፍ ማዘጋጀት ይችላሉ።
Chrome እንደ አዲስ ትር፣ ቅንብሮች እና Chrome Web Store ያሉ የራሱን ገጾች ለሁሉም ቅጥያዎች ይዘጋል። መራጩም የሚያነበው የሚታየውን የትሩን ክፍል ብቻ ነው፤ ስለዚህ መጀመሪያ ወደ ቀለሙ ያሸብልሉ።
አይችልም። አሁን ካለው የአሳሽ ትር ብቻ ይመርጣል። ወደ CMYK ወይም Pantone አይቀይርም፣ ንፅፅርም አይመረምርም።
ነፃ ነው፣ የአውታረ መረብ ጥያቄም አያደርግም። ታሪክዎና ነባሪ ቅርጸትዎ በመሣሪያዎ ላይ ይቀመጣሉ።