Actions

Work Header

Rating:
Archive Warning:
Fandoms:
Additional Tags:
Language:
English
Series:
Part 10 of Izzy's HTML & CSS Experiments , Part 2 of HTML & CSS Games
Stats:
Published:
2026-03-17
Words:
995
Chapters:
1/1
Comments:
18
Kudos:
47
Bookmarks:
2
Hits:
350

Simon Sequence Game

Summary:

A fully playable Simon memory game, built entirely in HTML and CSS. Watch the color sequence on each round button, memorize it, then open to begin. The sequence disappears the moment you start, so you're on your own. Eight rounds, each one longer than the last. How far can your memory take you?

Notes:

This work uses custom HTML and CSS formatting. For the intended experience, please enable Creator's Style (or ensure workskins are turned on in your AO3 preferences). The colours, layout, and glow effects are all part of the work itself.

This work is interactive — it's not a fic you read passively, it's a game you play. It's built entirely out of HTML disclosure elements, with no JavaScript whatsoever. That means:

• It works in any browser, on desktop or mobile
• Your progress isn't saved — refreshing the page resets everything
• Each move expands inline, so just keep scrolling down as you play
• If you pick the wrong colour, close it and try again — the others come back

The sequence is shown on the round button before you open it. Memorise it. The moment you click to begin, it's gone.

Good luck.

(See the end of the work for more notes.)

Work Text:

Simon

The sequence is shown on the round button before you open it. Memorise it — it disappears once you begin. Press the coloured buttons in order. Each round adds one more.

▶ Round 11memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 1

R

🎉 Round 1 complete!

▶ Round 212memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 2

R

✓ Correct!

Step 2 / 2

R

✗ Wrong — close and try again.

B

🎉 Round 2 complete!

▶ Round 3123memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 3

R

✓ Correct!

Step 2 / 3

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 3 / 3

R

🎉 Round 3 complete!

▶ Round 41234memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 4

R

✓ Correct!

Step 2 / 4

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 3 / 4

R

✓ Correct!

Step 4 / 4

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

🎉 Round 4 complete!

▶ Round 512345memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 5

R

✓ Correct!

Step 2 / 5

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 3 / 5

R

✓ Correct!

Step 4 / 5

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✓ Correct!

Step 5 / 5

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

🎉 Round 5 complete!

▶ Round 6123456memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 6

R

✓ Correct!

Step 2 / 6

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 3 / 6

R

✓ Correct!

Step 4 / 6

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✓ Correct!

Step 5 / 6

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✓ Correct!

Step 6 / 6

R

✗ Wrong — close and try again.

B

🎉 Round 6 complete!

▶ Round 71234567memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 7

R

✓ Correct!

Step 2 / 7

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 3 / 7

R

✓ Correct!

Step 4 / 7

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✓ Correct!

Step 5 / 7

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✓ Correct!

Step 6 / 7

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 7 / 7

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

🎉 Round 7 complete!

▶ Round 812345678memorise, then open

🕑 Sequence hidden — go from memory!

Step 1 / 8

R

✓ Correct!

Step 2 / 8

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 3 / 8

R

✓ Correct!

Step 4 / 8

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✓ Correct!

Step 5 / 8

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✓ Correct!

Step 6 / 8

R

✗ Wrong — close and try again.

B

✓ Correct!

Step 7 / 8

R

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✓ Correct!

Step 8 / 8

R

🎉 You beat Simon!

All 8 rounds complete!

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

B

✗ Wrong — close and try again.

G

✗ Wrong — close and try again.

Y

✗ Wrong — close and try again.

Notes:

This is built entirely from HTML details and summary elements — native browser disclosure widgets that toggle open and closed without any scripting. Every possible game state is pre-authored in the HTML as a branching tree: correct answers nest the next step inside them, and wrong answers are dead ends you can back out of. The CSS handles everything else—hiding the sequence when a round opens, showing only the chosen button once pressed, the colour glow on selection.

Thank you for playing. More games are coming very soon! ♥

---

If this moved you, even a little, please consider leaving a kudos or some feedback. I’ve poured a lot of time, love, and late-night tinkering into this. It's part of a new fixation, and I would love to hear everyone's thoughts.

Lately, I’ve realized: I have free will. Which means I’ve been joyfully and chaotically experimenting with HTML formatting and custom workskins to elevate the emotional cadence and visual rhythm of my character studies.

Please stay tuned for the next HTML piece! I will post/update something in this series weekly OR biweekly; if you want to stay updated on this HTML series, please consider subscribing or bookmarking.

You can find me on Bluesky ( @the_wild_poet25 ) and on Twitter (the_tamed_poet) if you want to connect. I'm also on Discord too!

The comment section also works—feel free to leave a comment! :)