Component Demos

Explore interactive examples and demonstrations of all the components used in HSKFlashCards.

Universal Flashcard System

New flashcard system with 6 designs using OKLCH colors for perceptual uniformity

View demo

Flashcard Design Concepts

Explore new design approaches for consistent, uniform flashcards

View demo

Flashcard Design Comparison

Side-by-side comparison of different flashcard designs

View demo

Flashcard Component

Interactive flashcard component with flip animations and keyboard controls

View demo

Vocabulary Card

Grid-based vocabulary cards with part of speech badges used in deck listings

View demo

Markdown & Typography

Complete showcase of markdown elements, typography, and prose styling

View demo

Table of Contents

Scroll-spy navigation with smooth scrolling and active state tracking

View demo

Scroll Behavior Test

Test scroll margins and header clearance for table of contents

View demo

Developer Notes

These demos are only available in development mode. They showcase the building blocks used throughout the application and serve as a reference for component implementation.