Dice and Coin

Project Overview

The Dice & Coin Playground is a small, interactive web app built with React.
It allows users to roll virtual dice or toss a coin using purely client-side logic – no APIs, no backend. The interface is clean, responsive, and accessible, making it a great example of React state management and animation basics.final year projects

Screenshots

Key Features

Dice Roller: Choose 1–6 dice, roll, and view the results instantly.
Coin Toss: Flip a virtual coin to get Heads or Tails.
Smooth animations for rolling and flipping using CSS transitions.
Fully responsive design (mobile, tablet, desktop).
Keyboard-accessible controls for inclusivity.
Local-only operation – runs completely offline, no API calls.

Functionality

Dice Roller:
- Select how many dice to roll (1–6).
- Click Roll → Each die shows a random Unicode face (⚀–⚅).
- Smooth roll animation before showing results.
- Reset button sets all dice to 1.
Coin Toss:
- Click Toss → Randomly selects “Heads” or “Tails”.
- Smooth flipping animation for realism.
- Reset clears the current result.

Technology Used

React.js (Vite setup): for component-based UI.
Tailwind CSS: for modern, responsive styling.
JavaScript (ES6): for logic and interactivity.
HTML5 + JSX: for semantic and clean markup.
CSS Animations: for dice roll and coin spin effects.

Why This Project Is Useful

Great for learning React basics, state management, and conditional rendering.
Demonstrates reusable components (Dice, Coin).
Ideal mini-project for interviews or portfolios showing UI logic without complex dependencies.
Can be extended easily – add scoring, localStorage saves, or multiplayer mode.