Leapsome UI components examples

Leapsome

A horizontal bar chart displaying gender pay distribution across different departments and regions. It compares average, female, diverse, and male compensation.

• Charts

Leapsome

A row of three key performance indicators (KPIs), each featuring a donut chart, a primary metric, and a descriptive label. The metrics show progress or status, such as '19/22' and '12'.

• Charts

Leapsome

A vertical timeline showing the progress of a multi-step process. Each step includes a status icon, a title, a progress bar with a percentage, and a date.

• Timeline & history

Leapsome

A donut chart showing the distribution of a salary budget, with a total amount and a breakdown of distributed and remaining funds.

• Charts

Leapsome

A vertical timeline showing a user's progress through a learning path. It includes a summary sentence at the top, followed by a series of steps with icons indicating completion status (completed, current, locked) and corresponding descriptive cards.

• Progress indicator

Leapsome

• Timeline & history

Leapsome

A bar chart showing employee count over time.

• Charts

Leapsome

A visualization of employee feedback with a bubble chart.

• Charts

Leapsome

A table displaying survey results across different categories and teams.

• Charts

Leapsome

A card displaying a statement with a progress bar and score.

• Card

Leapsome

A survey interface with multiple tabs.

• Tabs

Leapsome

A survey result visualization.

• Charts