ፎንትሌንስ

ነፃ የChrome ተሰኪ

ይህ ምን ፎንት ነው? ቀኝ ጠቅ ያድርጉና CSS ይመልከቱ

በማንኛውም ድረ ገጽ ላይ ጽሑፍ ይምረጡ፣ ቀኝ ጠቅ ያድርጉና “Inspect font with FontLens” የሚለውን ይምረጡ። የፎንት መርማሪው በገጹ ላይ ይከፈታል፤ የፎንት ቤተሰቡን፣ መጠኑን፣ ክብደቱን፣ line-height እና ቀለሙን ያሳያል፣ CSS ለመቅዳትና ፎንቱን ለማውረድም ያስችላል።

ወደ Chrome ጨምር — ነፃ ነው

በEdge፣ Brave፣ Opera እና በሌሎች የChromium አሳሾችም ይሰራል።

FontLens መርማሪ፦ በcap-height፣ x-height እና baseline መስመሮች መካከል ያለ የAg ናሙና፣ የፎንት መረጃዎችና Tailwind ኮድ

በጨረፍታ

ምን ይሰራል
የመረጡትን ጽሑፍ ፎንት ያሳያል፦ ቤተሰቡን፣ መጠንን፣ ክብደትን፣ line-height፣ ቀለምና ከመደበኛው የሚለዩ ቅጦችን፤ CSS ለመቅዳት ዝግጁ ነው።
እንዴት ይጀምራሉ
ጽሑፍ ይምረጡ፣ ቀኝ ጠቅ ያድርጉና “Inspect font with FontLens” ይምረጡ። የምናሌው ንጥል ጽሑፍ ሲመረጥ ብቻ ይታያል።
እንደ ምን ይቅዱ
CSS፣ SCSS፣ SASS ወይም Tailwind፤ መጠኑ px፣ rem፣ pt ወይም em ሊሆን ይችላል።
የፎንት ፋይል
Download font የድር ፎንቱን ከ@font-face ምንጩ ያመጣል። ከመጠቀምዎ በፊት የፎንቱን ፈቃድ ያረጋግጡ።
ለማን ነው
ለድር ዲዛይነሮች፣ ለfront-end ገንቢዎች፣ የተደራሽነት ኦዲተሮችና CSS ለሚማሩ ተማሪዎች።
ዋጋ
ነፃ። መለያም ሆነ የሚከፈልበት ስሪት የለውም።
ውሂብ
በአሳሽዎ ውስጥ ይሰራል። ሰርቨር ወይም የትንታኔ ስርዓት የለውም። የሚያደርገው ብቸኛ ጥያቄ እርስዎ የጀመሩትን የፎንት ማውረድ ነው።
የሚሰራባቸው
Chrome እና ከChrome Web Store ቅጥያዎችን በሚጭኑ ሌሎች የChromium አሳሾች። Firefox ወይም Safari አይደሉም።
ገደቦች
በድረ ገጾች ላይ ያለውን እውነተኛ ጽሑፍ CSS ያነባል። በምስሎች፣ canvases ወይም PDFs ውስጥ ያለ ጽሑፍን ወይም የChrome ገጾችን አያነብም።
ስሪት
2.2.0, የታደሰው 23 ኦክቶበር 2026

ፎንቱን በሁለት ጠቅታዎች ያግኙ

  1. 1

    ጽሑፍ ይምረጡ

    በማንኛውም ድረ ገጽ ላይ ርዕስ፣ አንቀጽ ወይም የአዝራር ጽሑፍ።

  2. 2

    ቀኝ ጠቅ ያድርጉ

    “Inspect font with FontLens” ይምረጡ። መርማሪው በገጹ ላይ ተከፍቶ የፎንት ቤተሰቡን፣ መጠኑን፣ ክብደቱን፣ line-height እና ቀለሙን ያሳያል።

  3. 3

    ይቅዱ ወይም ያስተካክሉ

    CSS ወይም Tailwind ይቅዱ፣ በቀጥታ ቅድመ እይታው ሌላ መጠን ወይም ቀለም ይሞክሩ፣ ወይም የፎንት ፋይሉን ያውርዱ።

ሰዎች ለምን ይከፍቱታል

Aa

የፎንቱን ስም ያግኙ

የወደዱትን ርዕስ አዩ? ይምረጡትና የፎንት ቤተሰቡን፣ ክብደቱንና ምንጩን ይመልከቱ፦ Google Fonts፣ Adobe Fonts ወይም ድረ ገጹ።

{ }

ከንድፍ ጋር ያዛምዱ

በቀጥታ ገጹ ላይ ያሉትን ቁጥሮች ከዲዛይን ፋይሉ ጋር ያወዳድሩ፣ ከዚያ ደንቦቹን እንደ CSS፣ SCSS፣ SASS ወይም Tailwind ይቅዱ።

4.5:1

ንፅፅርን ያረጋግጡ

የንፅፅር መጠኑን ከAA እና AAA ምልክቶች ጋር ይመልከቱ፤ ዲዛይኑን ከማጠናቀቅዎ በፊት ጽሑፉን ያጠቁሩ ወይም ጀርባውን ያብሩ።

ምን ይሰራል

  • ናሙና ከመለኪያ መስመሮች ጋር

    ከፎንት ስታክ የመጀመሪያውን ቤተሰብ ያሳያል፤ cap-height፣ x-height እና baseline መስመሮቹ ከፎንቱ ራሱ ይለካሉ።

  • የኮድ ቅርጸቶች

    CSS፣ SCSS፣ SASS እና Tailwind። ሙሉውን ኮድ ወይም አንድ መስመር ይቅዱ፤ የመጨረሻ ቅርጸትዎ ይታወሳል።

  • የመለኪያ አሃዶች

    መጠኑን px፣ rem፣ pt ወይም em እንደሆነ በመስኮችና በኮዱ ውስጥ ያሳዩ። rem የገጹን የራሱን root መጠን ይከተላል።

  • የፎንት ምንጭ

    ምልክቱ ፎንቱ ከየት እንደመጣ ያሳያል፦ Google Fonts፣ Adobe Fonts፣ በገጹ ላይ የተቀመጠ ወይም በኮምፒውተርዎ ላይ ያለ የስርዓት ፎንት።

  • የንፅፅር ምርመራ

    ቀለሞችን ሲቀይሩ የጽሑፍና የጀርባ ንፅፅር መጠን ከAA እና AAA ምልክቶች ጋር ለመደበኛና ትልቅ ጽሑፍ ይዘምናል።

  • ፎንት አውርድ

    ፋይሉን ከ@font-face ምንጭ ያመጣልና በፎንት ቤተሰቡ ስም ያስቀምጣል። ሰርቨሩ ካገደው ምንጩ በአዲስ ታብ ይከፈታል።

በDevTools ውስጥ ፎንቱን ማግኘት ለምን ይዘገያል?

ገጽ የፎንቶችን ዝርዝር ይገልጻል፤ አሳሹም ካሉት የመጀመሪያውን ይጠቀማል። የትኛው እንደሆነ ለማወቅ DevTools ይከፍታሉ፣ ኤለመንቱን ያገኛሉ፣ Computed ፓነሉን ያነባሉ፣ ከዚያ በNetwork ፓነል የፎንት ፋይሉን ይፈልጋሉ። መጠን፣ ክብደት፣ line-height እና ቀለም በተለያዩ ቦታዎች ይገኛሉ።

FontLens የመረጡትን ጽሑፍ computed style ያነባልና በአንድ ፓነል ያሳያል፦ የፎንት ቤተሰቦቹን፣ የመጀመሪያውን ናሙና፣ መለኪያዎችን፣ የፎንቱን ምንጭና CSS። የገጹን CSS ስለሚያነብ በምስል ውስጥ ያለ ፎንት ስም ማወቅ አይችልም።

ከአሳሽዎ ምንም አይወጣም

  • መለያ የለም፣ ሰርቨር የለም

    FontLens በአሳሽዎ ውስጥ ይሰራል። ትንታኔም ሆነ ክትትል የለም።

  • የመረጡትን ብቻ ያነባል

    መርማሪው ቀኝ ጠቅ ያደረጉበትን ጽሑፍ ቅጦች ያነባል። ስለ ገጹ ምንም መረጃ ወደ ሌላ ቦታ አይላክም።

  • አራት ፈቃዶች

    ለቀኝ ጠቅ ምናሌ ንጥሉ የአውድ ምናሌ፣ መርማሪው እንዲከፈት የንቁ ታብና የገጽ መዳረሻ፣ እንዲሁም የናሙና ጽሑፍዎን፣ አሃድዎንና የኮድ ቅርጸትዎን ለማስቀመጥ storage።

Chrome DevTools እና FontLens

Chrome DevTools እና FontLensChrome DevToolsፎንትሌንስ
በጽሑፍ ያለውን ፎንት ማግኘትInspect ያድርጉ፣ ኤለመንቱን ያግኙ፣ Computed ፓነሉን ይክፈቱጽሑፍ ይምረጡ፣ ቀኝ ጠቅ ያድርጉ፣ አንድ የምናሌ ንጥል
እንደ Tailwind ወይም SCSS መቅዳትአይቻልም፤ እሴቶቹን አንድ በአንድ ይቅዱየCSS፣ SCSS፣ SASS ወይም Tailwind ታብ
ፎንቱ ከየት እንደመጣበNetwork ፓነል ውስጥ የፎንት ፋይሉን ይፈልጉምልክት፦ Google Fonts፣ Adobe Fonts፣ በገጹ ላይ የተቀመጠ ወይም የስርዓት
የፎንት ፋይሉን ማውረድበNetwork ወይም Sources ውስጥ አግኝተው ያስቀምጡአንድ አዝራር
ንፅፅርን ማረጋገጥበStyles ፓነል የቀለም መምረጫ ውስጥበቀጥታ ቅድመ እይታ አጠገብ የAA እና AAA ምልክቶች
ዋጋአብሮ የተካተተነፃ

ጥያቄዎች

ድረ ገጽ የሚጠቀምበትን ፎንት እንዴት አገኛለሁ?

FontLens ወደ Chrome ያክሉ፣ በገጹ ላይ ጽሑፍ ይምረጡ፣ ቀኝ ጠቅ ያድርጉና “Inspect font with FontLens” ይምረጡ። የፎንት ቤተሰቡን፣ መጠኑን፣ ክብደቱን፣ line-height፣ ቀለሙንና ምንጩን ያያሉ።

ከድረ ገጽ የፎንት CSS እንዴት እቀዳለሁ?

በመርማሪው CSS፣ SCSS፣ SASS ወይም Tailwind ታብ ይምረጡና “Copy all” ይጫኑ፤ ወይም አንድ መስመር ይቅዱ። ካስፈለገ px፣ rem፣ pt ወይም em አሃዱን አስቀድመው ይምረጡ።

ከድረ ገጽ ፎንት ማውረድ እችላለሁ?

ጽሑፉ የድር ፎንት ሲጠቀም Download font ፋይሉን ከ@font-face ምንጭ ያመጣል። የስርዓት ፎንት የሚወርድ ፋይል የለውም። በፕሮጀክትዎ ከመጠቀምዎ በፊት ፈቃዱን ያረጋግጡ።

FontLens በምስል ወይም PDF ውስጥ ያለ ፎንት ሊያውቅ ይችላል?

አይችልም። በድረ ገጾች ላይ ያለውን እውነተኛ ጽሑፍ CSS ያነባል፤ ስለዚህ በምስሎች፣ canvases ወይም PDFs ያሉ ፎንቶችን ሊለይ አይችልም።

የጽሑፍ ንፅፅርን ለWCAG እንዴት እመረምራለሁ?

ቅድመ እይታው በጽሑፉና በጀርባው ቀለም መካከል ያለውን ንፅፅር ከAA እና AAA ምልክቶች ጋር ያሳያል። ከሁለቱ ቀለሞች አንዱን ሲቀይሩ ምልክቶቹ ይዘምናሉ።

መጠኖችን ከpx ይልቅ rem ማሳየት ይቻላል?

አዎ። አሃዱን px፣ rem፣ pt ወይም em ይቀይሩ፤ መስኮቹና ኮዱ ተመሳሳይ ይሆናሉ። rem ከገጹ root font-size ይሰላል፣ ምርጫዎም ይታወሳል።

ነፃ ነው? ውሂብ ይሰበስባል?

ነፃ ነው፣ መለያም አያስፈልግም። ሰርቨርም ሆነ ትንታኔ የለውም፤ የሚያደርገው ብቸኛ ጥያቄ እርስዎ የጀመሩትን የፎንት ማውረድ ነው።

በEdge፣ Brave ወይም Opera ይሰራል?

Edge፣ Brave፣ Opera እና Vivaldi ጨምሮ አብዛኞቹ የChromium አሳሾች ከChrome Web Store ቅጥያዎችን ይጭናሉ። Firefox እና Safari አይደገፉም።

ሌሎች የPYROCTAL ነፃ ቅጥያዎች

ይህ ምን ፎንት ነው? በሁለት ጠቅታዎች።

ወደ Chrome ጨምር — ነፃ ነው