Font Tuning Tool
Find the right @font-face descriptor values (ascent-override, descent-override, size-adjust) for any Google Font. Compare against your theme's default font to match vertical positioning.
Load Font
Active Font
Test Components
Card with Actions
Check vertical alignment between the heading text and buttons in the header above.
Analytics Dashboard
Card with title icon and action button.
Buttons
Inline text with badges
This is a paragraph with a badge and a success badge inline. How do they align?
Sample Table
| Name | Role | Status | Actions |
|---|---|---|---|
| John Smith | Developer | Active | |
| Jane Doe | Designer | Away | |
| Bob Johnson | Manager | Offline |
Form Elements
Select Sizes
Input Sizes
Typography
Heading 1 β The quick brown fox
Heading 2 β jumps over the lazy dog
Heading 3 β Pack my box with five dozen
Heading 4 β liquor jugs 0123456789
Body text: The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.
Small text: The quick brown fox jumps over the lazy dog.