| examples/component-accordion-actions.md |
153 |
AccordionActions - spec |
| examples/component-accordion-details.md |
147 |
AccordionDetails - spec |
| examples/component-accordion-summary.md |
180 |
AccordionSummary - spec |
| examples/component-accordion.md |
229 |
Accordion (Collapse) — spec |
| examples/component-account-card.md |
284 |
AccountCard (custom — Korean banking / fintech) — spec |
| examples/component-address-input.md |
260 |
AddressInput (custom — Korean) — spec |
| examples/component-affix.md |
190 |
Affix (sticky positioning) — spec |
| examples/component-alert-dialog.md |
210 |
AlertDialog — spec |
| examples/component-alert-title.md |
77 |
AlertTitle — spec |
| examples/component-alert.md |
192 |
Alert (Banner) — spec |
| examples/component-amount-input.md |
278 |
AmountInput (custom) — spec |
| examples/component-anchor.md |
198 |
Anchor (scrollspy / TOC) — spec |
| examples/component-app-bar.md |
249 |
AppBar (Top app bar / header) — spec |
| examples/component-aspect-ratio.md |
156 |
AspectRatio — spec |
| examples/component-auto-complete.md |
199 |
AutoComplete — spec |
| examples/component-avatar-group.md |
170 |
AvatarGroup - spec |
| examples/component-avatar.md |
191 |
Avatar — spec |
| examples/component-back-top.md |
123 |
BackTop — spec |
| examples/component-backdrop.md |
148 |
Backdrop — spec |
| examples/component-badge.md |
181 |
Badge — spec |
| examples/component-banner.md |
237 |
Banner — spec |
| examples/component-biometric-gate.md |
281 |
BiometricGate (custom — Korean mobile fintech) — spec |
| examples/component-blockquote.md |
153 |
Blockquote — spec |
| examples/component-border-beam.md |
207 |
BorderBeam — spec |
| examples/component-bottom-navigation.md |
226 |
BottomNavigation — spec |
| examples/component-box.md |
112 |
Box — spec |
| examples/component-breadcrumb.md |
222 |
Breadcrumb — spec |
| examples/component-button-base.md |
190 |
ButtonBase — spec |
| examples/component-button-group.md |
117 |
ButtonGroup — spec |
| examples/component-button.md |
213 |
Button — spec |
| examples/component-calendar.md |
280 |
Calendar (full month view) — spec |
| examples/component-callout.md |
131 |
Callout (info/warning/note in docs) — spec |
| examples/component-card-actions.md |
101 |
CardActions — spec |
| examples/component-card-content.md |
90 |
CardContent — spec |
| examples/component-card-header.md |
122 |
CardHeader — spec |
| examples/component-card-media.md |
79 |
CardMedia — spec |
| examples/component-card.md |
233 |
Card — spec |
| examples/component-carousel.md |
266 |
Carousel — spec |
| examples/component-cascader.md |
135 |
Cascader — spec |
| examples/component-category-picker.md |
271 |
CategoryPicker (custom — Korean fintech / 가계부) — spec |
| examples/component-chart.md |
237 |
Chart — spec |
| examples/component-chat-interface.md |
399 |
ChatInterface (custom — generic chat UI for chatbot / AI / live agent) — spec |
| examples/component-checkbox.md |
149 |
Checkbox — spec |
| examples/component-click-away-listener.md |
87 |
ClickAwayListener — spec |
| examples/component-code.md |
213 |
Code (inline + block) — spec |
| examples/component-collapsible.md |
219 |
Collapsible — spec |
| examples/component-color-picker.md |
110 |
ColorPicker — spec |
| examples/component-combobox.md |
267 |
Combobox — spec |
| examples/component-command.md |
299 |
CommandPalette — spec |
| examples/component-config-provider.md |
190 |
ConfigProvider — spec |
| examples/component-context-menu.md |
179 |
ContextMenu — spec |
| examples/component-css-baseline.md |
148 |
CssBaseline — spec |
| examples/component-date-picker.md |
249 |
DatePicker — spec |
| examples/component-descriptions.md |
242 |
Descriptions (key-value list) — spec |
| examples/component-dialog-actions.md |
111 |
DialogActions — spec |
| examples/component-dialog-content-text.md |
76 |
DialogContentText — spec |
| examples/component-dialog-content.md |
105 |
DialogContent — spec |
| examples/component-dialog-title.md |
104 |
DialogTitle — spec |
| examples/component-dialog.md |
176 |
Dialog — spec |
| examples/component-divider.md |
182 |
Divider (Separator) — spec |
| examples/component-doc-page.md |
217 |
DocPage (full doc page layout) — spec |
| examples/component-drawer.md |
257 |
Drawer — spec |
| examples/component-dropdown.md |
220 |
DropdownMenu — spec |
| examples/component-email-layout.md |
253 |
EmailLayout — spec |
| examples/component-empty-state.md |
269 |
EmptyState (custom — no-data + filtered-empty + first-run shell) — spec |
| examples/component-empty.md |
172 |
Empty — spec |
| examples/component-fade.md |
87 |
Fade — spec |
| examples/component-feature-grid.md |
201 |
FeatureGrid (3-up / 4-up feature display) — spec |
| examples/component-field.md |
266 |
Field — spec |
| examples/component-filled-input.md |
114 |
FilledInput — spec |
| examples/component-flex.md |
117 |
Flex — spec |
| examples/component-float-button.md |
214 |
FloatButton (FAB — Floating Action Button) — spec |
| examples/component-form-control-label.md |
134 |
FormControlLabel — spec |
| examples/component-form-control.md |
113 |
FormControl — spec |
| examples/component-form-controls.md |
251 |
Switch / Checkbox / Radio — combined spec |
| examples/component-form-group.md |
86 |
FormGroup — spec |
| examples/component-form-helper-text.md |
95 |
FormHelperText — spec |
| examples/component-form-label.md |
98 |
FormLabel — spec |
| examples/component-form.md |
291 |
Form — spec |
| examples/component-game-hud.md |
362 |
GameHUD (custom — composable in-game heads-up display) — spec |
| examples/component-game-menu.md |
327 |
GameMenu (custom — composable game menu shell with focus / input handling) — spec |
| examples/component-grid.md |
140 |
Grid — spec |
| examples/component-grow.md |
79 |
Grow — spec |
| examples/component-hero-block.md |
252 |
HeroBlock (landing hero) — spec |
| examples/component-hover-card.md |
211 |
HoverCard — spec |
| examples/component-icon-button.md |
142 |
IconButton — spec |
| examples/component-icon.md |
102 |
Icon — spec |
| examples/component-illustration.md |
280 |
Illustration (custom — themeable SVG illustration display) — spec |
| examples/component-image-list.md |
107 |
ImageList — spec |
| examples/component-image.md |
282 |
Image — spec |
| examples/component-input-adornment.md |
101 |
InputAdornment — spec |
| examples/component-input-base.md |
134 |
InputBase — spec |
| examples/component-input-number.md |
141 |
InputNumber — spec |
| examples/component-input-otp.md |
271 |
InputOTP (one-time password input) — spec |
| examples/component-input.md |
213 |
Input — spec |
| examples/component-item.md |
243 |
Item — spec |
| examples/component-kbd.md |
197 |
Kbd — spec |
| examples/component-krw-amount.md |
219 |
KRWAmount (custom — display-only currency formatter) — spec |
| examples/component-label.md |
118 |
Label — spec |
| examples/component-layout.md |
217 |
Layout (page chrome) — spec |
| examples/component-link.md |
223 |
Link — spec |
| examples/component-list-item-avatar.md |
72 |
ListItemAvatar — spec |
| examples/component-list-item-button.md |
139 |
ListItemButton — spec |
| examples/component-list-item-icon.md |
82 |
ListItemIcon — spec |
| examples/component-list-item-text.md |
98 |
ListItemText — spec |
| examples/component-list-item.md |
116 |
ListItem — spec |
| examples/component-list-subheader.md |
70 |
ListSubheader — spec |
| examples/component-list.md |
198 |
List — spec |
| examples/component-loading-button.md |
125 |
LoadingButton (pattern) — spec |
| examples/component-loading-sequence.md |
254 |
LoadingSequence (custom — splash + first-screen coordination) — spec |
| examples/component-lottie-player.md |
279 |
LottiePlayer (custom — designer-led After Effects animation in product UI) — spec |
| examples/component-masonry.md |
191 |
Masonry — spec |
| examples/component-mentions.md |
189 |
Mention (@-trigger autocomplete) — spec |
| examples/component-menu-item.md |
102 |
MenuItem — spec |
| examples/component-menu-list.md |
98 |
MenuList — spec |
| examples/component-menu.md |
139 |
Menu — spec |
| examples/component-menubar.md |
259 |
Menubar — spec |
| examples/component-message.md |
162 |
Message — spec |
| examples/component-mobile-stepper.md |
155 |
MobileStepper — spec |
| examples/component-modal.md |
220 |
Modal (Dialog) — spec |
| examples/component-navigation-menu.md |
295 |
NavigationMenu — spec |
| examples/component-notification.md |
166 |
Notification — spec |
| examples/component-otp-countdown.md |
245 |
OTPCountdown (custom — Korean SMS verification timer) — spec |
| examples/component-outlined-input.md |
145 |
OutlinedInput — spec |
| examples/component-page-transition.md |
281 |
PageTransition (custom — route-level animation wrapper) — spec |
| examples/component-pagination.md |
226 |
Pagination — spec |
| examples/component-paper.md |
199 |
Paper — spec |
| examples/component-pass-auth.md |
265 |
PASSAuth (custom — Korean 본인인증) — spec |
| examples/component-payment-brand-button.md |
253 |
PaymentBrandButton (custom — Korean) — spec |
| examples/component-payment-method-selector.md |
272 |
PaymentMethodSelector (custom — Korean) — spec |
| examples/component-payment-receipt.md |
277 |
PaymentReceipt (custom — Korean fintech) — spec |
| examples/component-popconfirm.md |
144 |
Popconfirm — spec |
| examples/component-popover.md |
239 |
Popover — spec |
| examples/component-popper.md |
129 |
Popper — spec |
| examples/component-pricing-cards.md |
247 |
PricingCards — spec |
| examples/component-progress.md |
195 |
Progress — spec |
| examples/component-qr-code.md |
201 |
QRCode — spec |
| examples/component-radio.md |
167 |
Radio (and RadioGroup) — spec |
| examples/component-rate.md |
202 |
Rate (Rating) — spec |
| examples/component-resizable.md |
163 |
Resizable — spec |
| examples/component-result.md |
270 |
Result + Empty — combined spec |
| examples/component-scroll-area.md |
199 |
ScrollArea — spec |
| examples/component-scroll-reveal.md |
320 |
ScrollReveal (custom — viewport-triggered animation primitive) — spec |
| examples/component-segmented.md |
178 |
Segmented (Toggle button group) — spec |
| examples/component-select.md |
258 |
Select / Combobox — spec |
| examples/component-separator.md |
177 |
Separator — spec |
| examples/component-sheet.md |
277 |
Sheet — spec |
| examples/component-sidebar.md |
257 |
Sidebar — spec |
| examples/component-skeleton.md |
178 |
Skeleton — spec |
| examples/component-slide.md |
89 |
Slide — spec |
| examples/component-slider.md |
208 |
Slider — spec |
| examples/component-snackbar-content.md |
92 |
SnackbarContent — spec |
| examples/component-snackbar.md |
121 |
Snackbar — spec |
| examples/component-sonner.md |
165 |
Sonner — spec |
| examples/component-space.md |
125 |
Space — spec |
| examples/component-spatial-locomotion.md |
373 |
SpatialLocomotion (custom — VR locomotion controller with comfort options) — spec |
| examples/component-spatial-panel.md |
330 |
SpatialPanel (custom — floating UI panel for VR / AR / spatial computing) — spec |
| examples/component-speed-dial-action.md |
78 |
SpeedDialAction — spec |
| examples/component-speed-dial.md |
177 |
SpeedDial — spec |
| examples/component-spin.md |
173 |
Spin (Spinner) — spec |
| examples/component-spinner.md |
204 |
Spinner — spec |
| examples/component-splitter.md |
210 |
Splitter (resizable panel) — spec |
| examples/component-stack.md |
130 |
Stack — spec |
| examples/component-statistic.md |
282 |
Statistic — spec |
| examples/component-step-button.md |
157 |
StepButton - spec |
| examples/component-step-connector.md |
157 |
StepConnector - spec |
| examples/component-step-content.md |
121 |
StepContent — spec |
| examples/component-step-icon.md |
115 |
StepIcon — spec |
| examples/component-step-label.md |
101 |
StepLabel — spec |
| examples/component-step.md |
84 |
Step — spec |
| examples/component-steps.md |
264 |
Steps (Stepper) — spec |
| examples/component-stock-chart.md |
251 |
StockChart (custom — Korean stock convention) — spec |
| examples/component-swipeable-drawer.md |
149 |
SwipeableDrawer — spec |
| examples/component-switch.md |
99 |
Switch — spec |
| examples/component-tab-scroll-button.md |
180 |
TabScrollButton - spec |
| examples/component-tab.md |
120 |
Tab — spec |
| examples/component-table-body.md |
82 |
TableBody — spec |
| examples/component-table-cell.md |
118 |
TableCell — spec |
| examples/component-table-container.md |
75 |
TableContainer — spec |
| examples/component-table-footer.md |
72 |
TableFooter — spec |
| examples/component-table-head.md |
78 |
TableHead — spec |
| examples/component-table-pagination.md |
137 |
TablePagination — spec |
| examples/component-table-row.md |
113 |
TableRow — spec |
| examples/component-table-sort-label.md |
109 |
TableSortLabel — spec |
| examples/component-table.md |
202 |
Table — spec |
| examples/component-tabs.md |
184 |
Tabs — spec |
| examples/component-tag-badge.md |
309 |
Tag + Badge — combined spec |
| examples/component-tag.md |
102 |
Tag — spec |
| examples/component-testimonial-carousel.md |
218 |
TestimonialCarousel — spec |
| examples/component-textarea-autosize.md |
114 |
TextareaAutosize — spec |
| examples/component-textarea.md |
173 |
Textarea — spec |
| examples/component-time-picker.md |
205 |
TimePicker — spec |
| examples/component-timeline.md |
170 |
Timeline — spec |
| examples/component-toast.md |
224 |
Toast (Snackbar) — spec |
| examples/component-toggle-button.md |
129 |
ToggleButton — spec |
| examples/component-toggle.md |
220 |
Toggle and ToggleGroup — spec |
| examples/component-toolbar.md |
104 |
Toolbar — spec |
| examples/component-tooltip.md |
178 |
Tooltip — spec |
| examples/component-tour.md |
176 |
Tour (in-product overlay tour) — spec |
| examples/component-transaction-list-item.md |
243 |
TransactionListItem (custom — Korean fintech / 가계부) — spec |
| examples/component-transfer.md |
156 |
Transfer (dual list) — spec |
| examples/component-tree-select.md |
202 |
TreeSelect — spec |
| examples/component-tree.md |
297 |
Tree (TreeView) — spec |
| examples/component-typography.md |
215 |
Typography (text primitive) — spec |
| examples/component-upload.md |
295 |
Upload — spec |
| examples/component-video-hero.md |
409 |
VideoHero (custom — autoplay landing-page video hero) — spec |
| examples/component-video-player.md |
340 |
VideoPlayer (custom — accessible HTML5 video with captions, speed, transcript) — spec |
| examples/component-voice-input.md |
408 |
VoiceInput (custom — push-to-talk + transcript voice input) — spec |
| examples/component-watermark.md |
217 |
Watermark — spec |
| examples/component-zoom.md |
92 |
Zoom — spec |
| examples/doc-explanation-example.md |
196 |
Worked example: explanation |
| examples/doc-how-to-example.md |
205 |
Worked example: how-to |
| examples/doc-tutorial-example.md |
162 |
Worked example: tutorial |
| examples/dogfood-korean-fintech-system.md |
433 |
Dogfood: Korean fintech mobile app — design system bootstrap |
| examples/email-transactional-example.md |
259 |
Worked example: transactional email (Korean fintech) |
| examples/palette-saas-violet.md |
235 |
Palette: B2B SaaS — violet primary |
| examples/print-business-card-spec.md |
205 |
Print spec: business card (Korean 명함, premium tier) |
| examples/print-packaging-spec.md |
285 |
Print spec: folding carton (Korean cosmetics, mid-tier) |
| examples/report-example.md |
228 |
Worked example: design audit report |
| examples/slide-deck-example.md |
237 |
Worked example: slide deck (talk archetype) |
| examples/website-improvement-report.md |
128 |
Website Improvement Plan: Korean SaaS Marketing Site |