Building a Farkle game website

Free plan

Reworking column markup to add arrows, land, and numbers.

Connect 4

Artifact·Only you

I’ve updated the same page (https://claude.ai/artifact/Mjd84vAAKX2JYU7hdvSNEq) with clearer play pathways. I haven’t tested it in a browser, so check that the arrows and landing circle line up with the columns.

Drop arrows: each column has an arrow above it in the current player’s color. The arrows are dim until you hover or focus a column, then the arrow brightens and grows.
Column highlight: the column you’re pointing at lights up, so the whole path your disc will fall down is visible.
Landing preview: a translucent disc shows the exact hole your token will land in, which lets you read the stack height at a glance.
Full columns: a full column’s arrow fades out and gets no highlight, so you can tell it’s unavailable. The arrows also dim while the computer is thinking.
Column numbers: 1 to 7 sit under the board to match the keyboard shortcuts.

I also moved the status line and controls to make room for the arrows. Possible next steps are marking the last move played, or showing which columns would win or block for you as an optional hint mode.

Make me a simple index.php file that looks inside it's own directory for files that end in HTML and create links to those files to look like buttons for a fancy index to all these game files. So it will see Farkle.html and create a button on the index with the TITLE attribute from that file and link to that file. And it will do this for any .html files that are in that same directory.

Created a file, shared files

I’ve made index.php. Put it in the same folder as your game files (like farkle.html and connect4.html) on a server with PHP. I haven’t run it on a server, so open it once and check the buttons.

Auto-discovery: it scans its own directory for every .html file each time the page loads, so new games show up when you refresh. No editing is needed.
Button labels: each button shows the text from the file’s <title> tag. I assume that’s what you meant by the title attribute. If a file has no <title>, it uses a tidied version of the filename instead, so my-game.html becomes “My Game”.
Order: buttons are sorted alphabetically by title.
Look: a grid of large 3D-style buttons that press down when clicked, with a color picked from each filename so a file keeps the same color. It follows the light or dark device setting and works on phones.
Skipped file: it ignores index.html so the page never links to itself.

To rename the page or its subtitle, edit $pageTitle and $tagline at the top of the file. It needs PHP 7.4 or newer.

Index

Code·PHP

Can you make me an html file that generates a random but playable Sudoku game in the same style of phone playable games we have setup so far?

Sudoku game with random unique-solution puzzles, single self-contained HTML page

Sudoku

Artifact·Only you

Sudoku is built and published as a single HTML file: https://claude.ai/artifact/AdXo2ZiZ1cREnxFLzaGxEJ. I haven’t played it through on a phone, so tell me if anything feels off. Its <title> is “Sudoku”, so it will show up on your index.php as a button.

Random puzzles: every game is freshly generated, and each puzzle has exactly one solution. Easy leaves about 40 starting numbers, Medium about 32 and Hard about 27.
Phone layout: the board scales to the screen width. You tap a cell and then a number on the pad, and each pad button shows how many of that digit are still left to place.
Highlights: the selected cell’s row, column and box are shaded, and every matching number lights up. A number that conflicts with another in its row, column or box turns red right away.
Tools: Undo, Erase, and Notes mode for pencil marks. Placing a number clears that digit from the notes in its row, column and box. Hint fills in one correct cell, using the selected one or picking a wrong or empty cell if none is selected.
Timer and win: the timer runs until you finish. A win screen shows your time and how many hints you used.
Saved game: it saves in your browser and resumes where you left off after a refresh or closing the tab.
Other: it follows the light or dark device setting, and works with a keyboard (digits, arrows, Backspace, N for notes, Ctrl+Z to undo).

Starting a new game asks first if you have unfinished work. Possible next steps are a mistake counter, a “check my work” button that flags wrong numbers against the solution, or a daily puzzle that is the same for everyone.

Make me a word puzzle game like wordle as an HTML page.

Wordle-style word guessing game as a single self-contained HTML page

Wordy

Artifact·Only you

I’ve built the word game as a single HTML file and published it: https://claude.ai/artifact/EUbDid4r5eANZYfrGw256X. I called it Wordy, and its <title> will show up as a button on your index.php. I haven’t played it through, so tell me if anything feels off.

Rules: six tries to guess a five-letter word. Green means the right letter in the right spot, yellow means the letter is in the word but elsewhere, and gray means it isn’t in the word. Repeated letters are handled the standard way.
Look: tiles flip over to reveal their colors one at a time, pop when you type, and the row shakes if you submit too few letters. The on-screen keyboard colors its keys to match, and your physical keyboard works too.
Modes: Daily gives everyone the same word for that date, and your progress is saved so a refresh won’t reset it. Random starts a fresh word whenever you like.
Stats: games played, win percentage, current and best streak, and a guess-distribution chart, all saved in your browser.
Sharing: the result screen has a Share button that copies the emoji grid, like 🟩🟨⬛, to your clipboard.
Display: it works on phones and follows the light or dark device setting.

One limitation: the answers come from about 540 common words built into the file. It doesn’t check guesses against a full dictionary, so any five letters are accepted, including nonsense like “QQQQQ”. A real dictionary is too big to put inline. If you want strict checking, you could drop a words.txt of valid guesses next to it and I’d have the page load it, which works when it’s hosted on your own site.

Possible next steps are a hard mode that forces you to reuse revealed hints, a colorblind-friendly palette, or a larger answer list.

Claude is AI and can make mistakes.

Claude responded: I've updated the same page (https://claude.ai/artifact/Mjd84vAAKX2JYU7hdvSNEq) with clearer play pathways.

You said: Make me a simple index.php file that looks inside it's own directory for files that end in HTML and create links to those files to look like buttons for a fanc…

Claude responded: I've made index.php.

You said: Can you make me an html file that generates a random but playable Sudoku game in the same style of phone playable games we have setup so far?

Claude responded: Sudoku is built and published as a single HTML file: https://claude.ai/artifact/AdXo2ZiZ1cREnxFLzaGxEJ.

You said: Make me a word puzzle game like wordle as an HTML page.

Claude responded: I've built the word game as a single HTML file and published it: https://claude.ai/artifact/EUbDid4r5eANZYfrGw256X.