Typography & Typescale Extractor de Ben Tran
Extracts typographyExtracts typography and generates a design system document. and generates a design system document.
Niciun utilizatorNiciun utilizator
Metadate extensie
Capturi de ecran
Despre această extensie
Reverse-engineer any website’s typography in a single click.
Stop digging through messy DevTools panels just to figure out what font sizes a website is using. Typography & Typescale Extractor automatically scans the active webpage, identifies the primary text elements (H1-H6, paragraphs, buttons, and links), and generates a beautifully formatted design system document right in your browser.
Whether you are building a brand guide, conducting competitor analysis, or looking for design inspiration, this tool does the heavy lifting for you.
✨ Core Features:
► Smart DOM Traversal: Ignores hidden SEO tags and invisible elements, extracting only the typography that is actually visible on the screen.
► Automatic REM Conversion: Dynamically calculates the root font size of the host website and converts pixel values into responsive rem scales.
► Live Visual Preview: Renders the exact font family, weight, and line-height using real sample text scraped directly from the page.
► Contrast-Aware Rendering: Automatically detects light text on dark background images and adjusts the preview contrast so the results are always readable.
► Clean & Minimal UI: Presents the data in a beautiful, structured grid inspired by professional typography tools.
🔒 Privacy First
This extension runs 100% locally in your browser. It does not track your browsing history, it does not use background tracking scripts, and no data is ever sent to external servers.
Stop digging through messy DevTools panels just to figure out what font sizes a website is using. Typography & Typescale Extractor automatically scans the active webpage, identifies the primary text elements (H1-H6, paragraphs, buttons, and links), and generates a beautifully formatted design system document right in your browser.
Whether you are building a brand guide, conducting competitor analysis, or looking for design inspiration, this tool does the heavy lifting for you.
✨ Core Features:
► Smart DOM Traversal: Ignores hidden SEO tags and invisible elements, extracting only the typography that is actually visible on the screen.
► Automatic REM Conversion: Dynamically calculates the root font size of the host website and converts pixel values into responsive rem scales.
► Live Visual Preview: Renders the exact font family, weight, and line-height using real sample text scraped directly from the page.
► Contrast-Aware Rendering: Automatically detects light text on dark background images and adjusts the preview contrast so the results are always readable.
► Clean & Minimal UI: Presents the data in a beautiful, structured grid inspired by professional typography tools.
🔒 Privacy First
This extension runs 100% locally in your browser. It does not track your browsing history, it does not use background tracking scripts, and no data is ever sent to external servers.
Evaluat cu 0 de către 0 recenzori
Permisiuni și date
Mai multe informații
- Linkurile suplimentului
- Versiune
- 1.2.0
- Mărime
- 21,72 KB
- Ultima actualizare
- o lună în urmă (23 apr. 2026)
- Categorii conexe
- Licență
- Licență MIT
- Politică de confidențialitate
- Citește politica de confidențialitate pentru acest supliment
- Istoricul versiunilor
- Etichete
- Adaugă în colecție