Sudoku Svelte

A modern, responsive Sudoku game built with Svelte, TailwindCSS, and Vite.

Features

• 🎮 4 Difficulty Levels: Easy, Medium, Hard, Expert
• ⏱️ Timer: Track your solving time with pause/resume
• 📝 Notes Mode: Toggle pencil marks for candidates
• ↩️ Undo: Revert your last moves (up to 50 steps)
• 🎯 Smart Highlighting: See related cells and same numbers
• ❌ Error Detection: Invalid placements are highlighted
• ⌨️ Keyboard Support: Full keyboard navigation and input
• 📱 Responsive: Works on desktop and mobile
• 🎨 Dark Theme: Easy on the eyes

Getting Started

Prerequisites

• Node.js 18+
• npm or pnpm

Installation

# Clone the repository
git clone https://github.com/lingster/sudoku-svelte.git
cd sudoku-svelte

# Install dependencies
npm install

# Start development server
npm run dev

Build for Production

npm run build
npm run preview  # Preview the build

How to Play

1. Click a cell to select it
2. Enter a number (1-9) to fill the cell
3. Press N to toggle notes mode for pencil marks
4. Use arrow keys to navigate between cells
5. Press Backspace or Delete to clear a cell
6. Press Ctrl+Z to undo

Keyboard Shortcuts

Tech Stack

• Svelte - UI framework
• TypeScript - Type safety
• TailwindCSS - Styling
• Vite - Build tool

Project Structure

src/
├── lib/
│   ├── sudoku.ts       # Game logic & puzzle generation
│   ├── store.ts        # Svelte stores for state management
│   ├── Board.svelte    # Game board component
│   ├── Cell.svelte     # Individual cell component
│   ├── NumberPad.svelte # Number input buttons
│   ├── Timer.svelte    # Game timer
│   ├── GameControls.svelte # Difficulty buttons
│   └── WinModal.svelte # Victory modal
├── App.svelte          # Main app component
├── main.ts             # Entry point
└── app.css             # Global styles

License

MIT