Score Bar

Score visualization from ResultsView. 5 horizontal bars where filled = bg-primary, empty = bg-border. Each filled bar uses the score-fill animation with staggered delay.

Score Bar Variants

Score from 1 to 5 with label and numeric indicator.

Структура відповіді
1/5
Глибина мислення
3/5
Чіткість комунікації
5/5
Орієнтація на користувача
2/5
Конкретність покращень
4/5
Sergiy Klimkovych

Need a design system like this?

I design and build products end‑to‑end — from first idea and design system to production‑ready code, ready to hand off to your development team.

Product Designer | AI Design Engineer | Designer for Startups | Mobile & Complex SaaS | from Idea to Product | Framer Developer