---
title: "PENALTY"
url: "https://aigamehub.app/zh-tw/games/hack-united-penalty-shootout-fdd79f"
source: "https://github.com/aarifmahdi/hack-united-penalty-shootout"
source_type: "github"
play_url: "https://aarifmahdi.github.io/hack-united-penalty-shootout/"
platform: "unknown"
login_required: false
pricing: "free"
origin: "original"
ai_tools: []
game_languages: ["en"]
author: "aarifmahdi"
author_handle: "aarifmahdi"
category: "休閒"
categories: ["casual", "simulation"]
tags: ["browser-game", "football", "hackathon", "penalty-shootout", "sports", "vanilla-js"]
added: "2026-11-06T06:09:42.264Z"
updated: "2026-11-06T06:09:42.264Z"
locale: "zh-tw"
content_locale: "zh-tw"
---

# PENALTY

一款主控台風格的瀏覽器十二碼大戰：選擇國家隊，進行五次射門，面對隨機反應的守門員選擇左、中、右，並以驟死賽分出平手。

## Description

PENALTY 是一款以純 HTML、CSS 和 JavaScript 打造的小型瀏覽器遊戲。在選隊畫面中，你可以選擇法國、西班牙、阿根廷或挪威；阿根廷會對上法國，而其他每個選擇都會對上阿根廷。接著你要踢五次十二碼，每次射門選擇方向（左、中、右），同時對方守門員會隨機反應，因此無法學習固定模式。若五次射門後比數相同，比賽會進入驟死賽。呈現方式是單色主控台風格，搭配單一綠色點綴，遊戲可直接從 GitHub Pages 執行，或從本機靜態伺服器執行，不需要建置步驟或安裝。

## Original post

1st INTERNATIONAL HACKATHON PARTICIPATION: This vibe-coded project is built for and submitted to HACKATHON "Hack United V7" hosted @ devpost. Play the game here: https://aarifmahdi.github.io/hack-united-penalty-shootout/

Topics: game, hackathon, vibecoding

# PENALTY — Hack United Submission A console-styled penalty shootout built for the **Sports** track. ## The idea Pick a team — France, Spain, Argentina, or Norway. Argentina fans face off against France; everyone else faces Argentina. Take 5 penalties, pick a direction (left / straight / right), and try to beat the keeper — who reacts randomly, so no pattern to learn, every match plays differently. If it's tied after 5, it goes to sudden death, just like a real shootout. ## Why it's built this way - **No frameworks** Pure HTML/CSS/JS so it loads instantly and runs anywhere, including directly off GitHub Pages. ## Run it Just open `index.html` in a browser — no install needed. Or serve it locally: ```bash python3 -m http.server 8000 # then visit http://localhost:8000 ``` ## Project structure ``` index.html — markup / screens (select, game, result) style.css — monochrome console look, single green accent script.js — game state + logic, plain vanilla JS assets/ — reserved for sound effects (see below) ``` ## What's next (stretch goals, not yet built) - Sound design: rising crowd tension before each kick, goal roar, save groan - Live/upcoming World Cup match ticker at the top of the game screen - Special "taunt" celebration animation when Argentina's keeper saves a shot - Difficulty tiers via adjustable opponent accuracy