VLLNT UI · Component family

Learning components

Learning components structure guided experiences — curricula, tutorials, flashcards, quizzes, steppers, progress trackers, and tours. Compose them into onboarding flows, courses, and interactive docs.

Browse all components How agents consume the registry23 components

Tutorials & Curriculum

Tutorial and curriculum components for building courses, lesson browsers, and guided onboarding tours.

Curriculum

Course-layout container for a sequence of lessons or modules with title, progress, optional intro, and a stack of lesson rows.

Tour

Guided onboarding flow for introducing content or interface patterns.

Tutorial Card

Card for displaying tutorial previews with metadata.

Tutorial Complete

Completion screen displayed when a tutorial is finished.

Tutorial Filters

Filter controls for browsing tutorials by category or difficulty.

Tutorial Intro Content

Introduction section for tutorial pages with overview and prerequisites.

Tutorial MDX

MDX renderer tailored for tutorial content with custom components.

Quizzes & Exercises

Interactive quiz, exercise, and flashcard components with ratings for active-recall learning.

Quiz

Interactive multiple-choice quiz with hints, explanations, and scoring.

Exercise

Interactive exercise block for learning content.

Flashcard

Study card for active recall with prompt and answer states.

Rating

Inline star rating for lightweight learner feedback.

Progress & Steps

Learning progress components — checklists, steppers, progress trackers, and completion dialogs for tracking course advancement.

Checklist

Interactive checklist with progress tracking and toggleable items.

Completion Dialog

Dialog displayed upon completing a task or workflow.

Progress Tracker

Curriculum-level learning dashboard for modules, lessons, exercises, streaks, and earned skills.

Step By Step

Numbered step guide with optional interactive completion tracking.

Stepper

Sequenced steps with complete, current, and upcoming states.

Study Aids & Callouts

Study aid components — annotations, key-concept blocks, pro tips, and learning objectives for educational content.

Annotation

Inline highlight with an attached contextual note.

Key Concept

Highlighted definition block for key terms and a glossary list.

Learning Objectives

Lists learning goals for educational content.

Pro Tip

Highlighted tip block with variants for tips, best practices, gotchas, and more.

Learner Utilities

Learner utility components — profile sections, search dialogs, and keyboard shortcut helpers for learning platforms.

Profile Section

User profile display section with avatar and details.

Search Dialog

Full-screen search dialog with keyboard navigation.

Keyboard Shortcuts Help

Displays available keyboard shortcuts to the user.

Readable by agents

Your AI agent can install these too.

The registry is exposed as structured data, so coding agents pick the right component without scraping HTML.

/llms.txt

Concise index per the llmstxt.org spec — sections, links, and descriptions.

/llms-full.txt

Full registry context in one fetch — docs plus every component descriptor.

/r/<name>.json

Per-component descriptor: props, accessibility schema, and usage examples.

Frequently asked

What's in the learning family?: Tutorials and curricula, lessons and flashcards, quizzes and exercises, steppers, progress trackers, and guided tours — the scaffolding for learning products.