Vis alle skrifttyper scanner en webside og præsenterer en komplet oversigt over alle skrifttypefamilier i brug — webskrifttyper indlæst fra CDN'er, selvhostede skrifttyper og systemskrifttype-fallbacks. Hver skrifttype viser en live tekst-forhåndsvisning, de indlæste vægte og stilarter, antallet af elementer, der bruger den, og et-klik-kopiering af CSS-skrifttypefamilie-erklæringen.
At identificere skrifttyper på et websted du beundrer, plejede at kræve inspektion af elementer et for et i DevTools, kontrol af den beregnede font-family-egenskab eller brug af browserudvidelser, der kun registrerer én skrifttype ad gangen. Vis alle skrifttyper giver dig det komplette billede i én visning — alle skrifttyper indlæst og brugt på siden med live tekstprøver, der viser præcis, hvordan hver skrifttype gengives. Værktøjet skelner mellem webskrifttyper (indlæst via @font-face eller Google Fonts) og systemskrifttyper (Arial, Helvetica, Georgia osv.) og viser den komplette font-family-stak. For hver skrifttype ser du, hvilke vægte der er indlæst (400, 600, 700), hvilke elementer der bruger den og hvilke skriftstørrelser der er anvendt. Klik på en skrifttype for at kopiere dens CSS-erklæring — klar til at indsætte i dit eget projekt.
Viser alle font-family faktisk gengivet på siden, herunder webskrifttyper fra Google Fonts, Adobe Fonts eller brugerdefinerede @font-face-erklæringer og systemskrifttype-fallbacks. Viser det samlede antal unikke skrifttypefamilier fundet.
Hver skrifttype vises med en live tekstprøve gengivet ved hjælp af den faktiske skrifttype-fil indlæst på siden. Du ser rigtig gengivelse — ikke en generisk forhåndsvisning.
For hver skrifttype, se hvilke vægte der er indlæst (Regular 400, Medium 500, SemiBold 600, Bold 700) og om kursive varianter er tilgængelige. Hjælper dig med at forstå skrifttypens indlæste delmængde.
Se, hvor mange elementer på siden der bruger hver skrifttype. Den mest brugte skrifttype vises først. Kend, hvilke skrifttyper er primære (brødtekst) og hvilke er sekundære (brugt på blot få elementer).
Klik på en skrifttypepost for at kopiere dens komplette CSS font-family-erklæring til din udklipsholder. Klar til at indsætte direkte i dit stylesheet.
Hver skrifttype viser sin kilde: Google Fonts (med den specifikke URL), Adobe Fonts, selvhostet (med @font-face URL'en) eller systemskrifttype. Kend præcis, hvorfra hver skrifttype kommer.
Besøg et websted med smuk typografi og se øjeblikkeligt alle skrifttyper, det bruger — navne, vægte og hvorfra de kommer. Aldrig mere hvad er det for en skrifttype? -gætteri eller brug af upålidelige skrifttype-identifikationsværktøjer.
Hvor mange skrifttyper indlæser din side? Er der ubrugte skrifttyper, der downloades men ikke anvendes? Vis alle skrifttyper viser faktisk brug — hvis en indlæst skrifttype har 0 elementer, der bruger den, er det spildt båndbredde.
Dokumentér dit projekts typografi ved at køre Vis alle skrifttyper på hver side. Verificer at de korrekte skrifttyper og vægte bruges konsekvent på tværs af stedet — fang useriøse font-family-erklæringer.
Identificerede du en skrifttype du kan lide, men den er en betalt skrifttype? Kopiér skrifttypenavnet og søg efter gratis alternativer med lignende karakteristika. Live-forhåndsvisningen hjælper dig med at huske præcis, hvordan det så ud.
Kør Vis alle skrifttyper på den samme side i forskellige browsere for at verificere, at de samme skrifttyper gengives overalt. Systemskrifttype-stakke opløses forskelligt på tværs af operativsystemer — fang inkonsistenser.
Åbn den flydende DevSuite Pro-dock, og klik på Vis alle skrifttyper-ikonet. Værktøjet scanner sidens beregnede stilarter og @font-face-regler.
Et panel viser alle skrifttyper fundet på siden, sorteret efter brugsfrekvens. Hver post viser skrifttypenavnet, forhåndsvisnings-tekst, vægte og elementtæller.
Rul gennem live-forhåndsvisningerne for at se, hvordan hver skrifttype gengives. Sammenlign sidens overskriftsskrifttype vs. brødtekstskrifttype vs. accentskrifttype.
Klik på en skrifttypepost for at kopiere dens font-family CSS-erklæring. Klik på kildelinket for at besøge skrifttypens oprindelse (Google Fonts-side, CDN-URL osv.).
Indsæt font-family-erklæringen i din CSS og indlæs skrifttypen fra den samme kilde for at bruge den i dit eget projekt.
Installer DevSuite Pro gratis og lås opp 39+ utviklerverktøy for nettleseren din.