strong-simple is a deliberately minimal todo application delivered as a single-page design. Its product intent is narrow and complete: one person captures the tasks they need to do, sees the current list of those tasks, and marks tasks complete as they finish them — all on one page, without navigating elsewhere.
The audience is anyone carrying too many open loops in their head and who wants the fastest possible path from "I must remember this" to "it is written down" to "it is done." The product is a private, domestic tool with a public-poster soul: the interface is loud, declarative, and immediate, because the entire point of a todo app is the visceral satisfaction of crossing something out.
The scope is intentionally small. There is no collaboration, no scheduling, no notification system, no reporting, and no multi-page information architecture. The single-page constraint is a hard product constraint, not a stylistic preference.
strong-simple is a browser-delivered, single-page todo application. A visitor arrives at a public Landing surface that explains what the application is, who it is for, and what it does, and offers a single entry action into the working list. The working list itself is the Todo page — the one page where all todo work happens: adding items, viewing the current list, filtering the list, and marking items complete.
The only active human actor is the Todo User. There are no other human roles, no administrators, no collaborators, and no reviewers. No system, provider, or external service acts on the user's behalf in the current scope; the application itself owns the todo list state.
Current accepted behavior is limited to:
Explicitly out of scope for the current delivery: any second working page, any account or sign-in requirement, any sharing or multi-user behavior, any due dates, priorities, tags, reminders, or recurring tasks, and any analytics or reporting surface.
Delivery. strong-simple is delivered as a first-party web application with custom UI. The application owns its own interface and its own todo list state. There is no provider-owned surface, no external destination, and no headless-only delivery in the current scope.
Access. Both accepted surfaces are reachable without establishing an identity. The Landing surface is a public entry surface by definition. The Todo surface carries no access requirement in the accepted contract: the Todo User reaches the working list directly from the Landing entry action and begins working immediately. No sign-in, account creation, invitation, or provisioning step is part of the accepted journey, and none is inferred, because the accepted behavior does not require the list to be privately owned, resumed across sessions, or bound to a verified participant. The todo list is a single working list belonging to whoever is using the page.
Current vs. future. Everything described in this document is current. No future-horizon requirements were accepted in the authoritative thread. The single-page constraint governs the current delivery and is not a placeholder for a later multi-page expansion.
Not applicable. No reference directive in this project declares a content_source, so no source content inventory is produced.
The page inventory is the accepted page contract, preserved exactly and in order: Landing, then Todo.
The public entry surface. It presents the application before any todo work begins.
START LIST → that takes the Todo User to the Todo page.STRONG / SIMPLE wordmark, flush-left, with the decorative off-edge crop applied to the wordmark's final letter only; the readable wordmark sits whole in the upper-left.START LIST →, butted flush against the left margin beneath the stacked words.0; the entry control remains available and unchanged.The single working page. All todo work happens here.
× delete control at the far right. No card, no shadow, no hover-lift.NOTHING LEFT. GOOD. set in Anton.NOTHING LEFT. GOOD.; the input block and filter chips remain available.Each requirement below is a distinct story point with its provenance, lifecycle facts, and observable acceptance.
FR-1 — Single-page todo application As a Todo User, I should use a todo application delivered as a single page, so that all my todo work happens in one place without navigating elsewhere.
explicitFR-2 — Public entry surface As a Todo User, I should arrive at a public entry surface that tells me what the application is, who it is for, and what it does, so that I know what I am opening before I begin.
required_inferenceSTART LIST → and arrives at the Todo page.FR-3 — Enter the working list As a Todo User, I should move from the entry surface into the working list with one action, so that I reach the place where I do my work immediately.
required_inferenceSTART LIST → control on the Landing surface. Observable result: the Todo page renders with the input block, filter chips, and current list.FR-4 — Add a todo item As a Todo User, I should add a todo item by typing its task text and submitting it, so that a task I am carrying in my head is written down.
explicitFR-5 — View the current list As a Todo User, I should see the current list of my todo items, so that I can see everything I still have to do.
explicit× delete control at the far right.FR-6 — Mark a todo item complete As a Todo User, I should mark a todo item complete, so that I get the satisfaction of crossing it out and can see what is left.
explicitFR-7 — Mark a completed item incomplete again As a Todo User, I should mark a completed item incomplete again, so that a task I closed by mistake returns to my outstanding list.
required_inferenceFR-8 — Delete a todo item As a Todo User, I should delete a todo item, so that a task I no longer need stops occupying my list.
required_inference× control at the far right of a todo row. Observable result: the row is removed from the list, and the outstanding count decreases by one if the removed item was outstanding.FR-9 — Filter the list As a Todo User, I should filter the list between all items, outstanding items, and completed items, so that I can look at just the slice I care about right now.
required_inferenceFR-10 — See the outstanding count As a Todo User, I should see a live count of my outstanding tasks, so that I always know how much is left.
required_inferenceFR-11 — Empty state As a Todo User, I should see a clear empty state when nothing remains, so that finishing everything feels like an event rather than a blank screen.
required_inferenceNOTHING LEFT. GOOD. set in Anton.Product context. The Todo User is the single active human role in strong-simple. They arrive with a head full of open loops and no interest in managing a system. They are not administering anything, not collaborating with anyone, and not reporting to anyone. They want the shortest possible path from remembering a task to having it written down, and from finishing a task to seeing it crossed out.
Primary goal. Keep a single working list of tasks that stays current — capture what needs doing, see what is left, and mark things done — without ever leaving the one page where the list lives.
Distinct accepted responsibilities.
Relevant inputs and decisions. The Todo User supplies free-form task text. Their decisions are binary and immediate: is this task done or not, and do I still need it. They also decide which slice of the list they want to look at, and they decide when to leave the entry surface and start working.
Interactions with other accepted participants. None. The Todo User is the only active human actor. No collaborator, reviewer, administrator, or external recipient participates in any accepted capability. The application itself holds the list state; no provider or external service acts on the user's behalf.
Observable success. The list reflects reality: every task the Todo User meant to capture is on it, every finished task shows the red strike and muted grey, the outstanding count matches what is actually left, and the empty state appears when nothing remains. The Todo User never had to navigate away from the working page to achieve any of it.
Constraints carried from source. The Todo User works within a single-page application. There is no second working page to move to, and no account to create or sign into.
STRONG stacked above SIMPLE in Anton at poster scale, flush-left, with the decorative off-edge crop applied to the wordmark's final letter only and the readable wordmark sitting whole in the upper-left.0, or a muted dash if the count cannot be read).START LIST → block butted flush against the left margin.Failure and recovery: if the outstanding count cannot be read on the Landing surface, the count block shows a muted dash and the START LIST → control remains fully usable, so the Todo User is never blocked from the working list.
× at the far right.Failure and recovery: if the item cannot be saved, the row is not added, the typed task text stays in the input block so nothing is lost, and a muted inline message states the change was not saved. The Todo User re-submits directly.
Failure and recovery: if the completion cannot be saved, the row returns to its outstanding state and a muted inline message states the change was not saved. The Todo User retries the checkbox directly.
× at the far right of the row. The row is removed from the list, and the outstanding count decreases by one if the removed item was outstanding.Failure and recovery: if either change cannot be saved, the row returns to its prior state and a muted inline message states the change was not saved. The Todo User retries the control directly.
NOTHING LEFT. GOOD. set in Anton.Failure and recovery: if the filter cannot be applied, the previously active filter remains selected and the list is unchanged.
NOTHING LEFT. GOOD. set in Anton.0.The creative direction is authoritative for this section. It names Paula Scher as the muse and "Typography as architecture — a todo list you can see from across the room" as the headline. The direction is translated below into concrete tokens.
| Role | Hex | Use |
|---|---|---|
| Background (paper) | #F2EFE6 | Warm off-white ground. Never pure white. |
| Surface | #FFFFFF | Reserved for the input surface, so the writing area reads as the brightest thing on the page. |
| Text | #0D0D0D | Big flat black type carries everything. |
| Primary (Scher-red) | #E63329 | Functional, not decorative: fills the add block, the completed-item strike, and the active filter chip. |
| Accent (poster yellow) | #F5C518 | Appears once per screen as a colour-block counterweight: the count badge, the empty-state band. |
| Muted | #6E6A61 | Warm grey for timestamps and helper text. |
Proportion: roughly 70% paper/white, 20% black type, 8% red, 2% yellow.
-0.02em, leading 0.86 so stacked lines lock together like a printed broadside. Headline sizes are enormous and flush-left.0.06em tracking to keep all-caps legible at small size; sentence case for input text.clamp(56px, 15vw, 128px); section heads clamp(40px, 6vw, 88px); UI labels 13–16px; input text 20px.Hard edges only — no border radius anywhere except the checkbox, which is a perfect square. Composition is built from flat rectangular colour blocks that butt directly against each other with no gaps: a red block meets a black block meets paper. Thin 2px black rules underpin the list rows like a printed ledger. Diagonal bands (a 4-degree skewed black strip) are used exactly once, as the divider between the poster hero and the working list.
A full-bleed poster hero occupying the first ~70vh: the word STRONG set in Anton at viewport-spanning scale, SIMPLE stacked beneath it in Scher-red, flush-left, bleeding off the right edge so the final letter is cropped by the viewport — decoration only; the readable wordmark sits whole in the upper-left. Below, the working list is a strict single column, max-width 760px, offset left rather than centred, with the input as a full-width white block and each todo as a ruled row: square checkbox, task text in Oswald 20px, delete as a small black × at the far right. Filter chips are flat rectangular blocks in a horizontal row — black when active, paper with a 2px black border when not. The count badge is a yellow block with black numerals pinned to the top-right of the list header.
Typography is the image — no photography, no illustration, no icons beyond a square checkbox and a black ×. The only non-type graphic elements are flat colour blocks, the 2px ledger rules, and one diagonal black band. The empty state is a yellow block with NOTHING LEFT. GOOD. set in Anton, filling the list area.
Rounded corners, soft shadows, or hover-lift cards — every surface is a hard-edged flat block. Any blue or indigo accent; the palette is paper, black, Scher-red and one yellow. A centred hero with subhead and a pill button — the headline is flush-left and oversized. Gradient blobs, glassmorphism, or frosted panels. Icons beyond the square checkbox and the black ×; no illustration, no photography. Inter, Roboto, Poppins or any neutral geometric sans — Anton and Oswald only. Animating the filter chips or adding easing bounce to the stamp-in. Cropping or overlapping any readable text or control; the off-edge crop applies to the decorative wordmark only.
Readable text and controls stay whole at every viewport: headlines, wordmarks, labels, numbers, and controls stay entirely inside the viewport and their container at 375px, 768px, and 1280px, wrapping or scaling (for example font-size: clamp(...) with its mobile size) to fit, and no other element covers any part of them. Imagery, decoration, and motion follow the creative direction: a shape, texture, or animation may be cropped, bled off an edge, rotated, overlapped, or cut exactly as the direction asks, as long as it covers no readable text or control. Moving and scrollable content may cross the viewport or container edge by design and is judged by whether it actually moves or scrolls and whether every item becomes fully readable as it passes. With prefers-reduced-motion, provide a usable static arrangement: wrap items into rows or allow horizontal scrolling so each item can be brought fully into view. Where the direction asks readable text or a control to be cropped, clipped, covered, or run off an edge, keep it whole and carry the gesture with decoration instead; for readable text and controls this rule takes precedence.
The generic indigo/blue-on-white SaaS template is forbidden for this project.
The broadside. The public entry is a poster, not a SaaS hero. A full-bleed warm paper ground (#F2EFE6) carries the stacked wordmark: STRONG in Anton at clamp(56px, 15vw, 128px), uppercase, flush-left, sitting on the baseline of the upper third; SIMPLE directly beneath it in Scher-red (#E63329) at the same size, tracked slightly wider. Together the two words span the full viewport width at 1280px, with the final E of SIMPLE running off the right edge — a decorative crop applied to the wordmark only, while the readable wordmark sits whole in the upper-left.
There is no subhead, no blue button, and no gradient. Instead, a single black rectangular CTA block — START LIST → in Oswald all-caps — is pinned flush to the left margin directly under the stacked words, and a yellow block holding the live task count sits hard against the right edge at the same vertical position. A 4-degree skewed black band cuts across the bottom of the hero and hands off to the working list below.
The concept recomposes only accepted content and controls: the application name, the who-it-is-for and what-it-does statements, the outstanding count, and the single entry action into the working list. It introduces no new behavior, page, or destination.
Interaction Model: Animated Motion Tempo: expressive Hero Dimensionality: flat
STRONG / SIMPLE wordmark at poster scale, flush-left, with the decorative off-edge crop on the final letter of SIMPLE.START LIST → block and the yellow count block as the only live elements. No accepted behavior is added; the marquee is decoration over the accepted wordmark.STRONG flush-left on the baseline of the upper third, SIMPLE in Scher-red stacked directly beneath, the final letter cropped by the viewport edge. The black START LIST → block butted flush against the left margin beneath the words; the yellow count block hard against the right edge at the same height. The 4-degree skewed black band cuts across the bottom of the hero.prefers-reduced-motion, the marquee does not run: the hero renders as a static poster with the wordmark, the START LIST → block, and the count block in their composed positions. The stamp-in and strike-wipe resolve instantly to their end states — the new row appears at full scale, and a completed row shows the red strike and muted grey immediately. Filter chips remain instant flips. Every readable element stays whole and inside the viewport.NFR-1 — Single-page delivery. The todo application is delivered as one page. The working list is not split across multiple pages, and no second working page is introduced. Provenance: explicit user constraint.
NFR-2 — Anonymous access. Both accepted surfaces are reachable without establishing an identity. No sign-in, account creation, invitation, or provisioning step is interposed between the Landing surface and the working list. Provenance: required_inference from the accepted access contract.
NFR-3 — Readable text and controls at every viewport. Headlines, wordmarks, labels, numbers, and controls stay entirely inside the viewport and their container at 375px, 768px, and 1280px, wrapping or scaling to fit, with no other element covering any part of them. Provenance: explicit creative direction.
NFR-4 — Reduced-motion support. With prefers-reduced-motion, the hero renders as a static poster and all motion resolves instantly to its end state, with every item fully readable. Provenance: explicit creative direction.
NFR-5 — Palette and typography fidelity. The interface uses only the specified palette (#F2EFE6, #FFFFFF, #0D0D0D, #E63329, #F5C518, #6E6A61) and only Anton and Oswald. No blue or indigo accent is introduced. Provenance: explicit creative direction.
NFR-6 — Hard-edged surfaces. No border radius anywhere except the square checkbox. No soft shadows, no hover-lift cards, no glassmorphism, no gradients. Provenance: explicit creative direction.
NFR-7 — Immediate capture. The input block is available as soon as the Todo page renders, so task capture is never delayed by list loading. Provenance: required_inference from the accepted capture lifecycle.
NFR-8 — Non-destructive failure handling. When an add, complete, uncomplete, or delete action cannot be saved, the affected row returns to its prior state and the user's typed task text is preserved in the input block. Provenance: required_inference from the accepted failure/recovery lifecycle.
No source-specified technology choices were provided in the authoritative thread; the above are labeled defaults and do not alter any product behavior.
Constraints (binding).
Assumptions (narrow, labeled).
Explicit exclusions.
×; no illustration or photography.× delete control at the far right.STRONG / SIMPLE wordmark block occupying the first ~70vh of the Landing surface.
Simple
A one-page todo list for one person — no accounts, no scheduling, no noise.
For anyone carrying too many open loops in their head.
Capture a task. See the list. Mark it done.
For anyone carrying too many open loops in their head — the person who just needs the fastest path from “I must remember this” to “it is written down” to “it is done.”
One page, no detours. Capture a task, see the list, mark it done — and cross it out for good.Capture a taskSee the listMark it done

Simple
A one-page todo list for one person — no accounts, no scheduling, no noise.
For anyone carrying too many open loops in their head.
Capture a task. See the list. Mark it done.
For anyone carrying too many open loops in their head — the person who just needs the fastest path from “I must remember this” to “it is written down” to “it is done.”
One page, no detours. Capture a task, see the list, mark it done — and cross it out for good.Capture a taskSee the listMark it done
No comments yet. Be the first!