Fuege CSS-Regeln oder Computed-Style-JSON aus deinem Browser ein, um Schriftgroessen einer Webseite zu erkennen. Das Tool wandelt rem, em, Prozent, pt und px in eine uebersichtliche Pixel-Tabelle um und zeigt line-height, Gewicht und Farbe.
Dieser Schriftgroessen-Detektor ist fuer echte Website-Audits gedacht. Fuege CSS, Inline-Styles oder JSON aus dem Browser-Snippet ein. Er ruft keine privaten Seiten ab und umgeht keine Sicherheit, sondern analysiert Stile, die du bereits einsehen kannst.
| Selektor | Groesse | Berechnet px | Line-height | Gewicht | Farbe |
|---|
Oeffne die Website und kopiere relevante CSS-Regeln, Inline-Styles oder berechnete Werte aus DevTools. Fuer Live-Daten nutze das Snippet auf einer Seite, die du pruefen darfst. Notiere bei Bedarf den Breakpoint oder den betroffenen Bereich, damit du Desktop- und Mobile-Proben spaeter sauber vergleichen kannst.
Viele Websites nutzen 16px als Root-Groesse, manche Designsysteme nicht. Setze den Basiswert, damit rem, em und Prozent realistisch umgerechnet werden. Wenn du mehrere Seiten oder Breakpoints vergleichst, verwende fuer jede Probe die tatsaechliche Root-Groesse statt einen pauschalen Standardwert.
Pruefe Selektor, deklarierte Groesse, berechnete Pixel, line-height, Gewicht und Farbe zusammen, um Inkonsistenzen schneller zu finden. Sortiere die Ergebnisse nach Bereich und achte besonders auf Ausreisser bei Navigation, Buttons, Karten und langen Textabschnitten.
Fuege CSS-Regeln oder Computed-Style-JSON aus deinem Browser ein, um Schriftgroessen einer Webseite zu erkennen. Das Tool wandelt rem, em, Prozent, pt und px in eine uebersichtliche Pixel-Tabelle um und zeigt line-height, Gewicht und Farbe. Es ist besonders hilfreich bei Relaunches, wenn du eine bestehende Seite nachbaust oder unterschiedliche Breakpoints vergleichen musst. Analysiere Header, Hero, Karten, Formularfelder und Footer getrennt, damit du Ausreisser erkennst und eine nachvollziehbare Typografie-Referenz fuer Designer, Entwickler und Content-Teams erstellst.
Pruefe, ob Headlines, Subheads, Buttons, Karten und Texte zu häufigen Fragen einer konsistenten Skala folgen.
Design-Handoffs mischen oft rem, em, Prozent und px. Dieses Tool macht sie vergleichbar.
Fuege Desktop- und Mobile-CSS getrennt ein, um Groessen ueber Breakpoints zu vergleichen.
Line-height, Gewicht und Farbe erklaeren oft, warum Text eng, schwer oder blass wirkt.
Dieser Schriftgroessen-Detektor ist fuer echte Website-Audits gedacht. Fuege CSS, Inline-Styles oder JSON aus dem Browser-Snippet ein. Er ruft keine privaten Seiten ab und umgeht keine Sicherheit, sondern analysiert Stile, die du bereits einsehen kannst. Vergleiche mehrere Proben aus verschiedenen Bereichen, bevor du eine globale CSS-Regel aenderst. So erkennst du, ob ein Problem aus der Deklaration, der vererbten Basisgroesse oder der tatsaechlichen Browserberechnung stammt. Die Seite ersetzt keine vollstaendige Designsystem-Dokumentation und keine Pruefung der Schriftlizenz.
Dieser Schriftgroessen-Detektor ist fuer echte Website-Audits gedacht. Fuege CSS, Inline-Styles oder JSON aus dem Browser-Snippet ein. Er ruft keine privaten Seiten ab und umgeht keine Sicherheit, sondern analysiert Stile, die du bereits einsehen kannst.
Am besten fuer: Schriftgroesse aus CSS oder Browser-Ausgabe pruefen
Nutze bildbasierte Schrifterkennung, wenn der Text in einem Screenshot, Logo oder gerasterten Bild vorliegt.
Am besten fuer: Schrift anhand eines Bildes erkennen
Die Browser-DevTools zeigen die exakten Werte für ein einzelnes Live-Element. Diese Seite hilft dir, mehrere Beispiele in einer übersichtlichen Tabelle zu vergleichen.
Am besten fuer: Ein einzelnes Element eingehend prüfen
Dieser Schriftgroessen-Detektor ist fuer echte Website-Audits gedacht. Fuege CSS, Inline-Styles oder JSON aus dem Browser-Snippet ein. Er ruft keine privaten Seiten ab und umgeht keine Sicherheit, sondern analysiert Stile, die du bereits einsehen kannst. Der Detektor ist besonders nuetzlich, wenn ein Designsystem nicht dokumentiert ist oder mehrere Teams an derselben Website gearbeitet haben. Statt einzelne Elemente im Browser zu vergleichen, kannst du CSS-Proben aus Header, Hero, Karten, Formularen und Footer nebeneinander auswerten. So siehst du sofort, ob Textgroessen logisch abgestuft sind oder ob einzelne Bereiche aus der Reihe fallen.
Fuege CSS-Regeln oder Computed-Style-JSON aus deinem Browser ein, um Schriftgroessen einer Webseite zu erkennen. Das Tool wandelt rem, em, Prozent, pt und px in eine uebersichtliche Pixel-Tabelle um und zeigt line-height, Gewicht und Farbe. Bei Relaunches hilft die Tabelle, alte Seiten sauber nachzubauen. Du kannst die wichtigste Typografie erfassen, Groessen in Pixel normalisieren und daraus eine kleine Referenz fuer Entwickler, Designer oder Content-Teams erstellen. Das reduziert Rueckfragen und verhindert, dass mobile oder sekundare Textstile uebersehen werden.
Nutze diesen Ablauf, wenn es um die CSS-Größe und nicht nur um den Namen der Schrift geht. Die Umrechnung ist bewusst transparent. Wenn ein Wert aus rem, em oder Prozent nur eine Näherung ist, bleibt der deklarierte Originalwert sichtbar. Für die genaueste Prüfung kannst du computed-style JSON aus dem Browser einfügen und die Ergebnisse dann mit dem geschätzten CSS-Block vergleichen.
Inspiziere den Text im Browser, kopiere CSS oder Computed Styles und fuege sie hier ein. Das Tool liest Größenangaben aus CSS und wandelt Einheiten in Pixel um. Bei rem, em oder Prozentwerten solltest du ausserdem die Root- oder Elterngroesse notieren, damit die Schaetzung sinnvoll bleibt.
Nein. Ein statisches Tool kann keine Cross-Origin-Regeln, private Seiten oder Sicherheit umgehen. Kopiere deshalb Stile von Seiten, auf die du Zugriff hast. So bleiben Login-Inhalte und geschuetzte Dokumente beim jeweiligen Anbieter, waehrend du nur die fuer dein Audit benoetigten Werte analysierst.
Deklariert ist der originale CSS-Wert wie 1.25rem. Berechnetes px ist die Umrechnung auf Basis des gewaehlten Basiswerts. Bei einer genauen Browserpruefung kann der berechnete Wert durch Vererbung, Media Queries oder die Groesse des Elternelements abweichen.
Ja. rem und em werden mit dem Basiswert umgerechnet. Bei em kann der echte Browserwert vom Elternelement abhaengen. Wenn die Verschachtelung komplex ist, fuege lieber Computed-Style-JSON ein und verwende die Umrechnung nur als schnelle Vergleichshilfe.
Lesbarkeit haengt nicht nur von Groesse ab. Diese Werte helfen, enge, schwere oder kontrastarme Texte zu erkennen. Vergleiche deshalb immer ganze Textgruppen und nicht nur eine einzelne Ueberschrift, denn Zeilenhoehe und Farbe koennen die Wirkung einer scheinbar passenden Groesse veraendern.
Nutze diese Seite fuer CSS-Schriftgroessen. Nutze den Bilddetektor, wenn du nur Screenshot, Logo oder Bild hast. Der Bildworkflow schaetzt den wahrscheinlichen Fontnamen, waehrend diese Seite vorhandene CSS- und Browserwerte vergleichbar macht.