Qwαderton | Documentation

Efficiency through simplicity. Learn how to write x.css compatible HTML.

1. Installation

Drop the stylesheet into your <head>. No build steps, no npm, no headaches.

<link rel="stylesheet" href="https://qwaderton.org/x.css">

2. The Workflow

The most efficient way to use x.css is to stop thinking about styling and start thinking about structure.

Use <header> for your titles and navigation.
Use <main> for the core content.
Use <section> or <article> to group ideas.
Use <aside> for callouts or quotes.

3. Typography

By default, x.css loads Manrope via the qwaderton.org edge. It uses a fluid scale that looks great on any screen size. To emphasize text, use the <strong> or <em> tags.

4. Full Example

Copy this template to start your next suckless project:

<!DOCTYPE html>
<html>
<head>
    <title>My Project</title>
    <link rel="stylesheet" href="https://qwaderton.org/x.css">
</head>
<body>
    <nav>
        <ul>
            <li><a href="#">Link</a></li>
        </ul>
    </nav>
    <header>
        <h1>My website</h1>
    </header>
    <main>
        <h2>Content Title</h2>
        <p>Your content goes here.</p>
    </main>
    <footer>
        <p>&copy; 2026</p>
    </footer>
</body>
</html>