Run ❯
Get your
own
website
❯
Run Code
Ctrl+Alt+R
Change Orientation
Ctrl+Alt+O
Change Theme
Ctrl+Alt+D
Go to Spaces
Ctrl+Alt+P
HTML
CSS
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href="styles.css" type="text/css"> </head> <body> <main> <p class="subtitle">Typography foundations</p> <h1>Readable, scalable, delightful</h1> <p>Establish a type scale, use semantic headings, and adjust spacing for clarity.</p> <blockquote>"Typography is the craft of endowing human language with a durable visual form." - Robert Bringhurst</blockquote> </main> </body> </html>
body { font-family: "Inter",sans-serif; margin: 0; background: #f8fafc; color: #0f172a; } main { max-width: 760px; margin: 0 auto; padding: 60px 24px; } .subtitle { font-size: 1.25rem; color: #475569; margin-bottom: 2rem; } h1 { font-size: clamp(2.5rem, 6vw, 3.5rem); margin-bottom: 0.75rem; } p { font-size: 1.125rem; line-height: 1.8; margin-bottom: 1.5rem; } blockquote { margin: 0; padding-left: 24px; border-left: 4px solid #6366f1; color: #3730a3; font-style: italic; }
