Paragon Design System

Technical Documentation

Paragon Design System

An accessible, theme-ready, and open source design system built for learning applications.

Design DocumentationFigma Library

All components (A-Z)

  • ActionRow
  • Alert
  • AlertModal
  • Annotation
  • Avatar
  • AvatarButton
  • Badge
  • Breadcrumbs
  • Bubble
  • Button
  • Button Group
  • Card
  • Carousel
  • CheckBoxGroup
  • Checkbox
  • Chip
  • Collapsible
  • ColorPicker
  • Container
  • Data views
  • DataTable
  • Dropdown
  • Dropzone
  • Fieldset
  • Figure
  • Form.Autosuggest
  • Form.Checkbox
  • Form.Control
  • Form.Control.Feedback
  • Form.Group
  • Form.Label
  • Form.Radio
  • Form.Switch
  • Forms
  • FullscreenModal
  • Hyperlink
  • Icon
  • IconButton
  • IconButtonToggle
  • Image
  • Input
  • Input Group
  • InputSelect
  • InputText
  • Layout
  • ListBox
  • MailtoLink
  • MarketingModal
  • Menu
  • Modal
  • ModalDialog
  • ModalLayer
  • ModalPopup
  • Nav
  • Navbar
  • OverflowScroll
  • Overlays
  • Page Banner
  • Pagination
  • Popover
  • ProductTour
  • Progress Bar
  • RadioButtonGroup
  • Scrollable
  • SearchField
  • SelectMenu
  • SelectableBox
  • Sheet
  • Skeleton
  • Spinner
  • Stack
  • StandardModal
  • StatefulButton
  • StatusAlert
  • Stepper
  • Sticky
  • Table (Deprecated)
  • Table Filters
  • TableControlBar
  • TableFooter
  • Tabs
  • TextArea
  • Toast
  • Tooltip
  • TransitionReplace
  • Truncate
  • ValidationFormGroup
  • useArrowKeyNavigation
  • useIndexOfLastVisibleChild
  • useIsVisible
  • useOverflowScroll
  • useToggle
  • useWindowSize
Library status
Usage insights
Code of Conduct
Open edX
Deploys by Netlify