Typre

CSS typing practice

Typre is a free typing trainer for programmers. Instead of prose, you type real CSS — brackets, operators and indentation included — and it measures WPM, accuracy, raw speed and consistency on every run.

Start typing CSS

What slows you down in CSS

Semicolons end every line and colons split every one, so your right hand never leaves that key pair. Hex colours are six random characters — the closest thing to a real random-string drill in normal code.

What the snippets cover

Flexbox and grid, custom properties, media and container queries, transitions and keyframes, pseudo-classes and pseudo-elements, clamp() and calc(), and dark-mode overrides.

Snippets you will actually type

Three of the 61 short CSS snippets, exactly as they appear in the app:

.card {
    display: flex;
    place-items: center;
}
.layout {
    display: grid;
    gap: 1rem;
}
:root {
    --brand: #f97316;
    --radius: 12px;
}

How it works

Pick 15, 30 or 60 seconds. Snippets are served in shuffled order, so you never repeat one before finishing a full round — even across page reloads. Sign in to put scores on the leaderboard, race a friend on the same snippet in real time, or paste code from your own project. None of it is required: open the page and start typing.

Other languages