Four Colors - Free Online UNO Card Game

Seele01-Flash
By
Four Colors is a free online card game inspired by UNO, where you compete to be the first player to empty your hand by matching colors and numbers in exciting multiplayer matches.

Prompt

MODEL: Seele01-Flash
Please use Three.js to generate a **mobile-first game** with the theme "Four Colors" (a stylized, UNO-inspired card game). Please read the following detailed game design requirements first, and then generate the code accordingly: ### 1. Assets & Environment * **Visual Style:** High-saturation, cartoon-style aesthetic similar to the promotional image. Use bright primary colors (Red, Blue, Green, Yellow) for the cards. The geometry should be low-poly with smooth shading. * **Card Models:** Create a standard card mesh with rounded corners. Use a single texture atlas containing all card faces (0-9, Skip, Reverse, Draw 2, Wild, Wild Draw 4) to reduce draw calls. The back of the cards should feature a geometric "Four Colors" logo pattern. * **Environment:** A simple, pleasing table surface (e.g., stylized felt or wood texture) centered in the scene. The background should be a dynamic 2D gradient or a simple sunburst pattern (like the screenshot) to keep rendering costs low. * **Camera:** Fixed perspective camera (orthographic or narrow FOV perspective) angled slightly top-down, ensuring the player's hand at the bottom of the screen is clearly visible without blocking the center play pile. * **Performance:** strict mobile optimization—limit total scene vertex count. Use baked lighting for the table shadows. ### 2. Audio Requirements * **BGM:** A lighthearted, casual looping track (acoustic guitar or light jazz) that is relaxing but keeps the pace moving. * **Sound Effects (SFX):** * *Card Slide/Flip:* Crisp "swish" sounds when cards move from hand to pile. * *Invalid Move:* A soft "thud" or buzzer if a player tries to play a non-matching card. * *Special Cards:* Unique chimes for Reverse, Skip, or Draw 2. * *The "1" Alert:* A distinct, urgent notification sound when a player has one card left. * *Victory/Defeat:* A celebratory fanfare for winning; a comedic "wah-wah" for losing. ### 3. Gameplay Loop * **Setup:** Support 2 to 4 players (1 human, 1-3 AI bots). Deal 7 cards to each player initially. * **Turn Logic:** * Players take turns matching the top card of the discard pile by **Color** or **Number/Symbol**. * If no match is available, the player must draw from the draw pile. * Implement logic for Action Cards: *Skip* (next player misses turn), *Reverse* (change turn order), *Draw Two* (next player draws 2 and misses turn). * Implement Wild Cards: Allow player to change the active color. *Wild Draw 4* forces next player to draw 4. * **The "One Card" Rule:** Crucial mechanic. When a player plays their second-to-last card, a "1" button must appear. If the player fails to press it within a short timer (or before the next player moves), they draw 2 penalty cards. * **Win Condition:** The first player to reach 0 cards wins the round. ### 4. Mobile Controls & Interaction * **Touch Input:** Use Three.js Raycaster for precise touch detection. * **Hand Layout:** The player's cards should be arranged in an arc at the bottom of the screen. * *Interaction:* Tapping a card selects it. If valid, it animates (using a tweening library like GSAP) to the center pile. If invalid, it shakes visually (feedback). * *Drag & Drop:* Optional but preferred: Allow dragging a card to the center for a more tactile feel. * **Screen Orientation:** **Landscape Mode** preferred to fit the hand arc and opponent avatars comfortably. Ensure UI elements scale responsively. * **UI Elements:** * "Draw Card" pile must be a large, clickable area. * The "1" (UNO) button must be prominent (at least 64x64px) and flash near the center of the screen when available. * Color Picker modal (for Wild cards) must feature large, thumb-friendly quadrants. * **Feedback:** Trigger vibration (Haptic Feedback API) on successful card plays and valid button presses. Do not ask for clarification. Do not request confirmation. Directly execute the generation task based on the given instructions.

Game Introduction

About Four Colors

Four Colors is an exciting free online card game that brings the classic UNO experience directly to your web browser. This multiplayer card game challenges you to be the first player to get rid of all your cards by strategically matching colors, numbers, and using powerful action cards. With support for 2-4 players, Four Colors offers endless entertainment for card game enthusiasts of all ages.

The game features a complete deck of 108 cards across four vibrant colors, including number cards, action cards, and wild cards that add strategic depth to every match. Whether you're playing with friends or competing against players worldwide, Four Colors delivers the same thrilling experience as the beloved UNO card game.

Core Features

Complete UNO-Style Gameplay

Four Colors faithfully recreates the classic card-matching experience with all traditional UNO rules and mechanics. The game includes the full spectrum of cards: 70% number cards (0-9) and 30% special action and wild cards that can completely change the game's momentum.

Real-Time Multiplayer Action

Compete with 2, 3, or 4 players in real-time matches. The game supports both local multiplayer and online play, allowing you to challenge friends or match against random opponents from around the world.

Strategic Card Types

Master three distinct card categories: - Number Cards : Basic matching cards from 0-9 in four colors - Action Cards : Skip, Reverse, and Draw Two cards that disrupt opponents - Wild Cards : Game-changing cards that let you choose colors and force draws

Browser-Based Convenience

No downloads or installations required. Four Colors runs smoothly in any modern web browser, making it accessible on computers, tablets, and smartphones.

Free-to-Play Experience

Enjoy unlimited gameplay without any cost. Four Colors is completely free, with no hidden fees or premium content restrictions.

Game Rules and Strategy

Basic Gameplay

The objective is simple: be the first player to play all cards from your hand. On each turn, match the previous card's color or number, or play a special card. If you cannot make a valid play, draw cards from the deck until you can.

Special Card Powers

  • Skip Card : Forces the next player to lose their turn
  • Reverse Card : Changes the direction of play
  • Draw Two : Makes the next player draw two cards and skip their turn
  • Wild Card : Allows you to choose any color for the next play
  • Wild Draw Four : Choose the next color and force the next player to draw four cards

Winning Strategy Tips

  • Save wild cards for crucial moments
  • Pay attention to other players' card counts
  • Use action cards to disrupt opponents when they're close to winning
  • Remember to press the "1" button when you have one card left to avoid penalty

Operation Guide

Controls

  • Mouse : Click cards to play them or draw from the deck
  • "1" Button : Must be pressed when you have exactly one card remaining
  • Color Selection : Click your preferred color when playing wild cards

Getting Started

  1. Choose multiplayer mode (2, 3, or 4 players)
  2. Wait for other players to join or invite friends
  3. Each player receives 7 starting cards
  4. Match colors, numbers, or play action/wild cards
  5. Remember to announce when you have one card left!

Why Play Four Colors

Four Colors offers the perfect combination of strategy, luck, and social interaction that makes UNO so beloved worldwide. The game is easy to learn but offers deep strategic possibilities, making it suitable for both casual players and competitive card game enthusiasts.

The convenience of browser-based play means you can enjoy quick matches during breaks or engage in longer gaming sessions with friends. With its faithful recreation of UNO mechanics and smooth online multiplayer, Four Colors provides authentic card game excitement without any barriers to entry.

Whether you're introducing children to card games or looking for a nostalgic gaming experience, Four Colors delivers immediate fun that keeps players coming back for more matches.

Frequently Asked Questions (FAQ)