36+ WINS

Hackathon
Starter Kit

The ultimate playbook for winning hackathons — guides, templates, and battle-tested strategies from 36+ hackathon victories and $100K+ in prizes.

Color Palette

Core Surfaces

background

foreground

card

surface

muted

accent

Brand & Actions

primary

secondary

volt

spark

success

destructive

Borders & Utility

border

input

ring

glow

Charts

chart-1

chart-2

chart-3

chart-4

chart-5

Typography

Display — JetBrains Mono

display-xl

display-lg

heading-lg

heading-md

heading-sm

Body — Outfit

body-lg — The quick brown fox jumps over the lazy dog. Hackathons are 24-48 hour sprints of pure creation.

body — The quick brown fox jumps over the lazy dog. Ship fast, break things, iterate. That's the hackathon way.

body-sm — The quick brown fox jumps over the lazy dog. 36 wins. 50+ hackathons. $100K+ in prizes.

Code — Fira Code

const hackathon = {
  name: "HackUTD 2024",
  result: "🏆 First Place",
  prize: "$5,000",
  team: ["Bill", "Kevin", "Spike", "Jasmine"],
  hoursSlept: 2,
};

Buttons

Badges

DefaultSecondaryOutlineDestructiveVoltSparkSuccess🏆 36+ Wins

Cards

🏆 1st PlaceNov 2024
TalkTuahBank
Voice-based banking via phone calls. No internet needed. Multi-language support with OpenAI Swarm.
Retell AINext.jsTwilio
🏆 Grand PrizeJun 2024
Dispatch AI
AI-powered 911 system addressing 82% understaffed call centers. $60K+ won. $50K SkyDeck funding.
Mistral LLMHume AIIntel Cloud
🏆 Google 1stApr 2024
AdaptED
AI lecturer adapting in real-time with emotion detection and conversational voice AI. LA Hacks winner.
GemmaFetch.AIWebRTC

Inputs

Effects & Animations

Glow Pulse

Pulsing Glow

Trophy Shimmer

36+ Hackathon Wins

Staggered Reveal

Ship
Fast
Win
Big
Repeat

Glass Morphism

Frosted glass navigation bar

backdrop-filter: blur(16px)

Float Animation

🏆
🚀

Stats Callout

36+

Hackathons Won

50+

Hackathons Attended

$100K+

In Prizes

4K+

Community Members

Font Specimen

--font-display

JetBrains Mono

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

--font-body

Outfit

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 !@#$%^&*()

--font-code

Fira Code

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 => !== === ->