Deadline Doom Countdown App

• 

  Home

Inspiration

Deadlines sneak up on us all — and we wanted a way to see and feel the looming doom. Inspired by the dread we all feel in the final hours before a big assignment, we thought: What if a countdown could actually make you panic — in a fun way? That’s how Deadline Doom was born. 😈

What it does

Lets you set a deadline

Shows a live animated countdown (days, hours, minutes, seconds)

Changes visuals and emoji mood based on how doomed you are:

😎 Chill (24+ hrs left)

😰 Mild panic (6–24 hrs left)

💀 Full doom (<6 hrs or past deadline)

Tracks time progress with a sleek doom bar

Persists the deadline in localStorage

Updates favicon emoji based on doom level (just to stress you out a bit more 😅)

How we built it

React + TypeScript for the frontend

TailwindCSS for styling and animations

Lucide Icons for expressive visual feedback

localStorage to persist state

Time logic crafted using native JavaScript Date API

Favicon emoji swapping done with SVG+data URI

Challenges we ran into

Creating accurate time calculations across time zones

Smoothly transitioning between doom states

Balancing fun panic vs real anxiety 😅

Making the UI feel aesthetically doomed but still modern

Accomplishments that we're proud of

Live doom visualizer that changes mood with time

Dynamic favicon emojis to subconsciously stress you out

Super smooth UI/UX — glassmorphic, glowy, aesthetic

Subtle background animation that matches urgency

You can’t ignore this countdown — it demands attention 💀

What we learned

Manage the Time by taking actions

What's next for the Deadline Doom Countdown App

Add multiple deadline support

AI-based productivity suggestions when doom is near

Mobile push notifications (“⚠️ PANIC MODE: You have 2 hours left”)

Shareable doom links to compete with friends

Add background music & sound FX for ultra-doom mode 😎💀🎵

Built With

• javascript
• react.js
• tailwind
• typescript