Quiz Screens UI for Figma

Test what a learner just studied. The question screen shows one question, four answers and a timer. The result screen shows the score, how the learner did and which answers to review.

What is included

  • A progress bar and a question counter
  • Four answer rows with one selected
  • A time left line and a check button
  • A score ring with percent and a praise line
  • Cards for correct, wrong and time, plus a review list

Where to use it

Use it for a learning app, an exam prep tool or a trivia game. Replace the question and the answers.

How to use it

Copy the component with the copy button and paste it into Figma with Ctrl+V or Cmd+V. The layers keep their auto layout, so you can edit text, colors and spacing. The text uses Plus Jakarta Sans, a free font on Google Fonts. Install it first so the text looks the same.

Light version

This listing is the light version. The dark version is listed separately, so you can pick the one that fits your project.

More like this