All challenges
UI · Frontend challenge · Frontend UI
Badge / Notification Pill
Difficulty
easy
Time
~15m
Format
Single
Grading
Human review
#ui#react#frontend#styling
Mission file // read carefullyeasy
Build a Badge / Notification Pill.
Requirements
- An element (e.g. Inbox envelope icon) with a red badge pill in the upper-right corner displaying a count.
- If count is
0, hide the badge. - If count exceeds
99, format it as99+. - Include buttons to increase/decrease the count.
Build with
ReactLive preview as you type
Human review
Start challenge
Sign in to save your progress.