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> <header> <h1>Styling Essentials</h1> <p>CSS transforms HTML into beautiful interfaces.</p> </header> <main> <article class="card"> <h2>Typography</h2> <p>Adjust fonts, weights, and spacing.</p> </article> <article class="card"> <h2>Colors</h2> <p>Create consistent palettes with hex or HSL.</p> </article> </main> </body> </html>
body { font-family: "Source Sans Pro",sans-serif; margin: 0; background: #f0f4ff; color: #0f172a; } header { background: #6366f1; color: #fff; padding: 60px 24px; text-align: center; } main { max-width: 720px; margin: 0 auto; padding: 40px 24px; } .card { background: #fff; border-radius: 16px; padding: 24px; margin-bottom: 24px; box-shadow: 0 15px 35px rgba(15,23,42,0.12); } .card h2 { margin-top: 0; }
