FontLens

Pasirinkite bet kokį tekstą, paspauskite dešinįjį pelės mygtuką ir akimirksniu patikrinkite šriftą, dydį, svorį, spalvą ir CSS –…

Ar kada nors atsidūrėte tinklalapyje, grožėjotės raidėmis ir susimąstėte „koks čia šriftas“? FontLens atsako į šį klausimą vienu paspaudimu. Pasirinkite bet kokį tekstą bet kurioje svetainėje, dešiniuoju pelės mygtuku spustelėkite ir pasirinkite „Tikrinti šriftą su FontLens“. Švari, sutelkta lentelė atsiranda tiesiai virš puslapio ir atskleidžia, kaip tiksliai tas tekstas yra sukurta: šrifto tipas, jo dydis, svoris, eilutės aukštis, spalva ir visos kitos dizaino detalės. Nesvarbu, ar esate dizaineris, atliekantis išdėstymo analizę, kūrėjas, derinantis specifikaciją, ar tiesiog smalsus apie gražią antraštę, šis įrankis bet kurį tinklalapį paverčia atvira tipografijos knyga. FontLens yra šriftų ieškiklis ir CSS inspektorius viename. Jis ne tik nurodo šriftų šeimos pavadinimą, bet ir pateikia paruoštą naudoti kodą, interaktyvią žaidimų aikštelę idėjoms išbandyti ir prieinamumo įrankius, kad jūsų tekstas būtų skaitomas. Jokios paskyros. Jokios registracijos. Tiesiog pasirinkite, spustelėkite dešiniuoju pelės mygtuku ir išanalizuokite. 🔍 Ką galite daryti • Akimirksniu atskleiskite visą pasirinktų žodžių tipografiją: šriftų šeimą, šrifto dydį, šrifto svorį, eilutės aukštį ir spalvą • Pamatykite papildomą stilių, kurį lengva praleisti, pvz., tarpžodinį tarpą, teksto transformaciją ir šrifto stilių • Nukopijuokite bet kurią vieną savybę vienu paspaudimu arba paimkite visą taisyklių rinkinį kaip išsamų CSS fragmentą • Konvertuokite tą fragmentą į Tailwind, SCSS arba SASS per paprastas skirtukus, tada kopijuokite visą arba eilutę po eilutės • Eksperimentuokite tiesioginėje, redaguojamoje peržiūroje: perrašykite pavyzdinius žodžius, koreguokite vertes, pakeiskite foną ir stebėkite, kaip jis akimirksniu atsinaujina • Nustatykite, iš kur atsiranda žiniatinklio šriftas, naudodami teikėjo ženklą (Google Fonts, Adobe Fonts, savarankiškai talpinamas arba įmontuotas sistemos šriftas) • Išsaugokite žiniatinklio šriftą savo kompiuteryje naudodami mygtuką „Atsisiųsti šriftą“, tiesiogiai paimtą iš jo šaltinio • Patikrinkite spalvų kontrastą pagal WCAG standartus, su tiksliu santykiu ir AA bei AAA teigiamais arba neigiamais rezultatais • Išsirinkite ir atrinkite spalvas su pilnu spalvų rinkikliu, įskaitant lašintuvą, skirtą paimti bet kurį pikselį ekrane • Perjunkite matavimo vienetus tarp px, rem, pt ir em, taikomus tiek laukams, tiek eksportuotam kodui 🖱️ Kaip tai veikia Naudotis FontLens užtrunka sekundes. Pažymėkite žodžius, kuriuos norite ištirti, dešiniuoju pelės mygtuku spustelėkite ant pasirinkimo ir meniu pasirinkite „Tikrinti šriftą su FontLens“. Lentelė atsiranda virš dabartinio puslapio, tvarkingai suformuota, kad ji niekada nesukeltų konflikto su pačios svetainės išvaizda. Iš ten galite perskaityti detales, nukopijuoti tai, ko jums reikia, arba pradėti redaguoti. Tiesioginė peržiūra yra tai, kur viskas tampa smagu. Pakeiskite formuluotę, kad išbandytumėte tikrą antraštę, pakoreguokite dydį, pakoreguokite svorį arba nustatykite naują fono spalvą, kad pamatytumėte, kaip tipas laikosi. Jūsų pakeitimai išlieka, kai pereinate tarp puslapių ir grįžtate vėliau, todėl idėja, kurią pradėjote vienoje svetainėje, laukia jūsų kitoje. Kai norite atkurti pradinės vertes, mygtukas „Atkurti į svetainę“ atkuria viską, ką puslapis iš tikrųjų naudoja. Reikia neapdoroto turto? Atsisiunčiamam žiniatinklio šriftui, vienas mygtukas atsiunčia tikrąjį failą iš jo @font-face vietos. Šrifto, kuris jau yra jūsų operacinėje sistemoje, FontLens jums praneša, kad tai yra įmontuotas šriftas, todėl žinote, kad jis yra prieinamas be jokio atsisiuntimo. 🔒 Privatumas pirmiausia FontLens veikia tik jūsų naršyklėje. Nėra duomenų rinkimo, sekimo, analizės ir jokių išorinių serverių, dalyvaujančių teksto tikrinime. Viskas, ką tiriate, lieka jūsų kompiuteryje. Plėtinys atlieka tik vieną tinklo užklausą, ir tik tada, kai sąmoningai paspaudžiate „Atsisiųsti šriftą“, tada jis kreipiasi į to šrifto šaltinį, kad gautų failą. Nieko daugiau nepalieka jūsų įrenginio. Leidimai yra sąmoningai siauri. Kontekstinio meniu leidimas prideda dešiniojo pelės mygtuko įrašą. Aktyvaus skirtuko leidimas leidžia įrankiui skaityti tekstą, kurį pasirinkote skirtuke, kuriame jį iškviečiate, ir niekur kitur. Saugykla saugo jūsų peržiūros tekstą ir jūsų vienetų bei formato preference'ų, kad jie būtų prisimenami kitą kartą. Nėra plataus prieigos prie jūsų naršymo istorijos ir jokių plačių pagrindinio kompiuterio leidimų. 👥 Kam skirta • Žiniatinklio dizaineriai, kurie nori nustatyti šrifto tipą, užfiksuoti paletę ir greitai pakartotinai naudoti stilius • Front-end kūrėjai, derinantys maketą arba perkeliantys tikslias šriftų šeimos ir tarpų vertes į kodą • UI ir UX inžinieriai, kuriantys nuoseklias, prekės ženklo atitinkančias tipų sistemas • Studentai, besimokantys CSS ir tipografijos, kurie nori pamatyti, kaip konstruojamos realios svetainės • Prieinamumo auditoriai, patikrinantys, ar tekstas atitinka WCAG kontrasto reikalavimus prieš publikavimą • Tinklaraščininkai, rinkodaros specialistai ir smalsūs skaitytojai, kurie tiesiog nori žinoti, kokį šriftą naudoja svetainė ✨ Kodėl žmonės jį pasilieka • Vienas dešiniojo pelės mygtuko paspaudimas suteikia atsakymą, užuot gilinantis į kūrėjų įrankius • Kodas yra paruoštas kopijavimui paprastu CSS, Tailwind, SCSS arba SASS, todėl jis tiesiogiai įtraukimas į jūsų projektą • Redaguojama peržiūra leidžia jums prototipuoti tipų pasirinkimus neliečiant nė vienos kodo eilutės • Kontrasto tikrinimas įtraukia prieinamumą į jūsų darbo eigą, o ne palieka jį kaip vėlesnę mintį • Spalvų rinkiklis ir lašintuvas reiškia, kad galite atrinkti ir pakartotinai naudoti tikslias spalvas iš bet kurios puslapio vietos • Šviesios ir tamsios temos automatiškai seka jūsų operacinę sistemą, todėl ji jaučiasi kaip namuose dieną ar naktį • Vienetų perjungimas tarp px, rem, pt ir em palaiko išvestį suderintą su tuo, kaip parašyta jūsų kodų bazė 🎨 Išsamesnis detalių žvilgsnis Tipografija yra daugiau nei pavadinimas. FontLens atskleidžia smulkius sprendimus, kurie leidžia tekstui jaustis tinkamai, nuo antraštės svorio iki eilučių aukščio ir subtilaus raidžių tarpo sekimo. Matydami šias vertes šalia, galite suprasti, kodėl dizainas veikia ir kaip jį atkurti. Teikėjo ženklas taip pat suteikia konteksto, akimirksniu pasakydamas, ar žiūrite į Google Fonts turtą, Adobe Fonts veidą, savarankiškai talpinamą failą ar sistemos numatytąjį, o tai dažnai yra pirmas ženklas, kai ketinate atitikti ar gauti šriftą. Spalvų įrankiai viršija statinį rodmenį. Rinkiklis siūlo HSV kvadratą su atspalvio ir alfa slankikliais, ir jis kalba HEX, RGB ir HSL, todėl galite dirbti bet kuriuo jums patogiu formatu. Suporuokite tai su lašintuvu ir galėsite paimti tikslų bet kurio elemento atspalvį ir įdėti jį į savo peržiūrą ar pastabas. 🚀 Pradėkite tikrinti Pridėkite FontLens, pažymėkite keletą žodžių ir dešiniuoju pelės mygtuku spustelėkite, kad atskleistumėte bet kurio puslapio tipografiją, stilius ir spalvas. Tai greitas, privatus ir tikrai naudingas palydovas visiems, kuriems rūpi, kaip skaitoma internete. Įdiekite jį, laikykite jį po ranka ir niekada daugiau nesistebėkite nežinomu šriftu.