62 adaptive Flutter components.
One design system.
Install one package instead of a dozen fragmented ones, and get components
that already agree on spacing, corners, motion and colour — because they read
the same tokens. Change spaceMd once and the whole app changes
rhythm together.
- 62
- components
- 881
- tests passing
- 0
- analyzer issues
- 184
- responsive cases
- AA
- WCAG contrast, verified
Install
One dependency. Every component reads the same tokens, so theming lives in one place.
flutter pub add prism_kit
// One import gives you everything.
import 'package:prism_kit/prism.dart';
// Register a look once, at the root.
MaterialApp(
theme: prismTheme(seed: brandPurple),
darkTheme: prismTheme(seed: brandPurple, brightness: Brightness.dark),
home: const HomePage(),
);What makes it different
Three things that are easy to claim and harder to deliver. All three are covered by tests you can read.
A design system, not a bundle
Every one of the 62 components reads PrismTokens and
PrismColors. Tests install deliberately unusual tokens and assert
the components adopt them, so a hard-coded radius or duration fails CI.
Accessible by default
Live regions for state you did not trigger, decorative content hidden from screen readers, minimum touch targets, sortable headers that announce their direction, and reduced motion honoured everywhere.
Adaptive, not just responsive
Tables become labelled cards on a phone. Tabs scroll instead of clipping. The stepper collapses to a step counter. Compact below 600 px, expanded above 840 px, one widget throughout.
Zero lock-in
No database, backend or cloud dependency. The AI client and the updater are the only networked pieces, and you own the endpoints.
Verified, not vibes
The semantic palette is checked against WCAG AA across ten brand seeds in both brightnesses, and a 184-case matrix pumps every component at 320 px and 1600 px in LTR and RTL.
Testing helpers included
prismTestApp configures the tokens, a real viewport,
brightness, direction and reduced motion — because a zero-size viewport makes
adaptive tests silently assert nothing.
All 62 components
Every one has an interactive demo in the gallery. Filter to find what you need.
Layout and navigation
Structure, movement, and the shapes a screen takes.
AdaptiveScaffoldBottom nav bar → navigation rail → expanded rail, by window widthAdaptiveDialogPlatform-adaptive dialogs from a single callAdaptiveSheetBottom sheet on phones, centred dialog on desktop — one callTabsAdaptive tab strip: scrolls on phones, shares the width on desktopMasterDetailResponsive two-pane layouts (list → detail) that push on compact windowsStepperWizard progress: horizontal on wide, compact "Step X of Y" on phonesAccordionCollapsible sections with single-expansion modeCommandPalette⌘K launcher with fuzzy search, grouping and keyboard navigation
Data and input
Collecting and presenting information, forms included.
DataTableSortable table that becomes labelled cards on narrow windowsCalendarMonth grid with single/range/multiple selection, markers and localisable namesFormDeclarative forms: fields, validators, submit lifecycle statesSearchAdaptive search: local datasets or debounced async backendsSettingsiOS-style grouped settings pages with searchable tilesChipInputTag/token entry with paste splitting, duplicates, limits and suggestionsOtpFieldOTP/PIN entry with paste, auto-submit, SMS autofill and groupingRatingStar rating with half values and full slider semanticsSegmentedControlSingle-choice control that scrolls instead of overflowing
Feedback and status
Telling the user what is happening without interrupting them.
ToastAdaptive toasts: bottom-centered on mobile, stacked top-right on desktopBannerDismissible announcement banners; dismissals persist across restartsStateViewsLoading / empty / error / success state widgets driven by one notifierSkeletonShimmering placeholders: text, card, tile list, circle — reduced-motion awarePaginationInfinite-scroll list with page loader, empty/error/retry statesConnectionBannerOffline/online banner with debounce, retry and live-region announcementsSyncStatusCompact, live-region sync indicator with progress, retry and six phasesBadgeCount or status dot, collapsing to 99+ and hiding at zeroTimelineVertical event timeline with connectors, semantic roles and rich nodes
Content, media and platform
Rendering, appearance, and the pieces that talk to the outside.
MarkdownFast, plugin-free CommonMark + GFM renderer with syntax highlightingCodeViewSyntax-highlighted, copyable code viewer with pluggable tokenizersChangelogParse a Keep-a-Changelog markdown file into collapsible "What's new" cardsPaletteExtract dominant/vibrant/muted color palettes from imagesAvatarImage with deterministic initials fallback, presence dots and badgesImageRetrying network image provider with configurable backoff strategyUpdaterIn-app update flow: version gates, rollouts, skip-version, download progressPrismAiProvider-agnostic streaming AI chat: OpenAI, Ollama, Groq, DeepSeek, Gemini, Anthropic — with typed events, tool-calling loop and a ready chat viewLottieLottie metadata reader: dimensions, duration, frame count, preload cacheDividerWithLabelDivider with a centred label, for grouping contentSliderStyled slider with semantics label, value display and optional divisionsSwitchSwitch tile with title, subtitle, icon and Prism colour schemeCheckboxCheckbox tile with title, subtitle and tristate supportDropdownDropdown field with label, icon, validation and semanticsRefreshIndicatorPull-to-refresh with a configurable colour and semantics labelFabMenuExpanding FAB menu with staggered labelsLoadingOverlayTranslucent scrim with a spinner and message, blocks interactionEmptyStateIcon, title, subtitle and action button, in two sizesLinearProgressDeterminate or indeterminate bar with label and percentageCircularProgressCircular progress with a value in the middleCardCard with optional tap, long-press, border, radius from tokensTileList tile with leading, title, subtitle, badge and trailing widgetDividerHairline divider with optional centred labelZoomableImagePinch-to-zoom image with placeholder and error fallbackCarouselHorizontally scrolling slides with a dot indicator
The design system, at a glance
The real default values, read from the source when this page was built.
Override any of them in ThemeData.extensions and every component
follows.
Spacing scale
Corner radii
Motion
durationFast 120 ms · durationMedium 240 ms · durationSlow 420 ms
Durations collapse to zero when the platform asks for reduced motion. Controls default to 44 px tall.
Semantic roles
success and warning use fixed, tested colours so they
never collapse into a green or amber brand colour. error and
info come from your own ColorScheme.
Built to be read
The source is short and documented, with no clever indirection. If you want to know how something works, read it.
- Strict analysis.
strict-casts,strict-inferenceandstrict-raw-types, reporting zero issues. - Every animated component takes its duration from the platform's reduce-motion setting.
- Style classes resolve against the theme. Unset fields stay nullable and are filled in one
resolve(context)call. - Documented trade-offs. Where something is a heuristic — token estimation, deletion detection — the docs say so.
- 881 tests passing across unit, widget and matrix suites. Read them.