# Kit parts

190 everyday parts in twelve finishes, filed under 50 categories. Every one runs on its page, and on this one.

Docs · 190 pages · https://tactileui.dev/parts

Every page here is Markdown too: add .md to its address. The whole library as JSON: https://tactileui.dev/catalog.json

## Accordions

- [Accordion](https://tactileui.dev/parts/accordion): Printed sections that open in place.
- [Collapsible](https://tactileui.dev/parts/collapsible): One section that opens in place.

## AI chats

- [Chat](https://tactileui.dev/parts/chat): An AI chat as a teleprinter, with restraint: what you type sits in a recess; the answer prints on a perforated slip with an amber lamp at the print head; code comes up on display glass.
- [Tool call](https://tactileui.dev/parts/tool-call): A job ticket for each tool an agent runs: the tool’s name printed as a legend, a lamp on the stub, the state in words and the time on a small LCD.
- [Reasoning](https://tactileui.dev/parts/reasoning): The model’s working, printed on a paper tape that feeds behind a smoked window.
- [Sources](https://tactileui.dev/parts/sources): Where an answer got what it says, as a card index.
- [AI approval flow](https://tactileui.dev/parts/ai-approval-flow): A whole approval flow for an agent console, made of the kit’s own parts: the chat, a tool call that waits for a person, the reasoning and the sources, with one status lamp and a walkthrough tray.
- [Message](https://tactileui.dev/parts/message): One chat message as a plate, with no chat around it, and made the way the chat is made.
- [Composer](https://tactileui.dev/parts/composer): The prompt box.
- [Suggestion chips](https://tactileui.dev/parts/suggestion-chips): Starter prompts as small plates set out under the composer.
- [Model picker](https://tactileui.dev/parts/model-picker): Choose a model.
- [Token meter](https://tactileui.dev/parts/token-meter): How much of a model’s context a conversation has used, as a segmented meter with the limit printed at its end.
- [Message actions](https://tactileui.dev/parts/message-actions): The keys under a reply: Copy, Retry, and a pair to rate it up or down.
- [Agent run](https://tactileui.dev/parts/agent-run): The panel for one run of an agent, laid out like any calm panel in an app: its name, a status line with a lamp, the state in words and the time it has been going, and a Stop key.
- [Plan steps](https://tactileui.dev/parts/plan-steps): An agent’s plan as checked steps down a groove, with the pipeline’s stations stood on end.

## Alerts

- [Alert](https://tactileui.dev/parts/alert): A message let into the surface, with an annunciator: a small lit legend (Note, Done, Check, Fault) beside the words that say what happened.
- [Banner](https://tactileui.dev/parts/banner): A strip the width of the page, above everything, for one announcement: a lamp, one line, an optional key that goes somewhere and a dismiss key.
- [Callout](https://tactileui.dev/parts/callout): A note let into running text, for docs and articles: the Alert’s idea, made quiet.

## Avatars

- [Avatar](https://tactileui.dev/parts/avatar): A person’s mark, struck like a coin: initials stamped into the field, or a photo set under the rim, with a status lamp mounted at five o’clock.
- [Profile card](https://tactileui.dev/parts/profile-card): A person’s ID plate: their coin set in a countersunk socket, name and role, a rating plate of facts engraved in tabular figures, and one key to act.
- [ID plate](https://tactileui.dev/parts/id-plate): A staff badge for a person.

## Lit surfaces

- [Brushed metal](https://tactileui.dev/parts/brushed-metal): A brushed metal surface under a raking light.
- [Lamp pool](https://tactileui.dev/parts/lamp-pool): A warm pool of lamplight on a desk.
- [Grille moiré](https://tactileui.dev/parts/grille-moire): Two speaker grilles laid one over the other.
- [Louvre light](https://tactileui.dev/parts/louvre-light): A wall lit from the side, with the shadows of slats across it, as when the sun comes through blinds.

## Badges & tags

- [Tag](https://tactileui.dev/parts/tag): A small printed plate: a type, a count, a badge.
- [Status](https://tactileui.dev/parts/status): A lamp with words: the state line in tables, panel heads and lists.
- [Lamp](https://tactileui.dev/parts/lamp): The only colour in the kit: a lamp that is on.
- [Tag input](https://tactileui.dev/parts/tag-input): A text input that turns what you type into printed tags.
- [Chip group](https://tactileui.dev/parts/chip-group): Small plates you press on and off, laid in a tray that wraps: the filters over a table, the topics on a form, the sizes on a product.
- [Sync status](https://tactileui.dev/parts/sync-status): A small legend that says whether your work is safe: Saving, Saved or Offline, with a lamp that matches (amber and blinking while it saves, green when it has, red when it cannot).

## Buttons

- [Key](https://tactileui.dev/parts/key): Every button, and every link that acts like one: a cap on a skirt that drops below the plate when pressed.
- [Icon key](https://tactileui.dev/parts/icon-key): A key with an icon and no words, square or round: transport, power, the small tools.
- [Commit key](https://tactileui.dev/parts/commit): A key for work that takes time and must not run twice.
- [Kbd](https://tactileui.dev/parts/kbd): The key to press, drawn as the key: a small cap on a skirt with a dish worked into its top.
- [Button group](https://tactileui.dev/parts/button-group): Keys that belong together set side by side in one slot, like the transport keys of a deck.
- [Toggle key](https://tactileui.dev/parts/toggle-key): One key that latches below the plate and stays there.
- [Copy key](https://tactileui.dev/parts/copy-key): A key that copies a value and says so.
- [Toolbar](https://tactileui.dev/parts/toolbar): A rack of keys in one slot cut into the plate, under one tab stop.
- [Split button](https://tactileui.dev/parts/split-button): An action and the menu of its other ways, as two keys in one outline: Save, and a narrow key beside it for Save as draft or Save and close.

## Calendars & date pickers

- [Calendar](https://tactileui.dev/parts/calendar): A month on a plate.
- [Date picker](https://tactileui.dev/parts/date-picker): A date field with its calendar card in a slot underneath: type a date in any common form for your locale, or press the key and the card slides out.
- [Date field](https://tactileui.dev/parts/date-field): A date typed in three segments, day, month and year, in the field’s own well.
- [Time field](https://tactileui.dev/parts/time-field): A time of day in the field’s well: hours, minutes and, on a 12 hour clock, AM or PM, each a segment you can type into or step with the arrow keys.

## Cards & panels

- [Panel](https://tactileui.dev/parts/panel): A face plate that groups what belongs together: a head, a rule, then the parts.
- [Tray](https://tactileui.dev/parts/tray): A recess cut into the plate that holds other parts: keys, a selector, an empty state waiting for its first thing.
- [Split panes](https://tactileui.dev/parts/split): Two panes and a groove cut across the plate between them, with a knurled grip set in the groove.
- [Grille and cloth](https://tactileui.dev/parts/grille): Perforated metal and speaker cloth, for the place where a real device would breathe or sound.
- [Hover card](https://tactileui.dev/parts/hover-card): A preview that hangs from a link when the pointer rests on it or the keyboard reaches it.
- [Choice card](https://tactileui.dev/parts/choice-card): A radio or a check set as a large plate carrying a name, a sentence and a price.
- [Separator](https://tactileui.dev/parts/separator): An engraved rule: a fine groove cut into the plate, a hairline with a catch of light on its lower wall, or on its right wall when it stands upright.
- [Divider with label](https://tactileui.dev/parts/divider-label): A rule with a word set into it.

## Carousels

- [Carousel](https://tactileui.dev/parts/carousel): Slides seen one at a time through a viewer’s gate: transport keys either side of a frame counter on an LCD, lamp keys to jump, swipe on touch.
- [Film strip](https://tactileui.dev/parts/film-strip): A carousel as a strip of film in a machined viewer.

## Charts

- [LED bar chart](https://tactileui.dev/parts/ledbars): A bar chart built like a studio meter bridge: columns of LED segments behind a smoked window, green then amber then red, with a peak segment that lingers and a lit readout for the exact value.
- [Needle gauge](https://tactileui.dev/parts/gauge): A moving-coil panel meter: a printed scale under glass, a thin needle that swings past the mark and settles, a lamp for the bands and a small LCD for the exact reading.
- [Ring meter](https://tactileui.dev/parts/ring): The kit’s donut chart as an instrument: a ring of lamps behind dark glass in a spun bezel, lit clockwise from twelve like a studio clock’s seconds, with the value in lit digits in the middle.
- [Chart recorder](https://tactileui.dev/parts/recorder): A strip-chart recorder: gridded paper advancing under a pen that rides a rail, drawing the live value as the paper moves and printing the time in the margin.
- [Lamp heatmap](https://tactileui.dev/parts/heatmap): A heatmap as a matrix of small panel lamps set into the plate: each lamp’s brightness is the value, off to full in four steps, with a printed legend.
- [LED matrix](https://tactileui.dev/parts/matrix): A dot-matrix display of round LEDs behind smoked acrylic, each with its own bloom and a short warm-up and fade.
- [Plot](https://tactileui.dev/parts/plot): Line charts drawn as light on glass, or as ink on a panel: gridlines faint, two traces at most, a red line for now.
- [Glass](https://tactileui.dev/parts/glass): Dark display glass for plots and live readouts, whatever the finish around it.
- [Sparkline](https://tactileui.dev/parts/sparkline): A word-sized line for the margin of a table or beside a readout.
- [Bars](https://tactileui.dev/parts/bars): Printed bars on the panel, one value each.
- [Uptime strip](https://tactileui.dev/parts/uptime-strip): A row of ticks, one for each day or hour, on a strip of dark glass, each tick a lamp in its own slot, with the percentage on an LCD above.
- [Stacked bars](https://tactileui.dev/parts/stacked-bars): Columns split by series on a display well.
- [Scatter](https://tactileui.dev/parts/scatter): Points on two labelled scales, with a crosshair that reads the nearest point wherever the pointer is.
- [Radar](https://tactileui.dev/parts/radar): One value on each of several spokes, joined into a shape on straight-sided rings of one shared scale that starts at zero in the middle.
- [Treemap](https://tactileui.dev/parts/treemap): Shares of a whole as nested rectangles, each sized by its value, one level at a time.
- [Funnel](https://tactileui.dev/parts/funnel): The stages of a process in order, each as wide as how many got that far, centred and to scale, with the drop-off written between each pair: the number lost and its share of the stage before.
- [Waterfall](https://tactileui.dev/parts/waterfall): Gains and losses stepping from a start to a total.
- [Candlestick](https://tactileui.dev/parts/candlestick): Open, high, low and close for each session, with the volume traded under it, for market data.

## Checkboxes

- [Check](https://tactileui.dev/parts/check): An option in a form: a small square key that presses below the plate when chosen, with a tick printed on it.
- [Checklist](https://tactileui.dev/parts/checklist): The kit’s check keys in nested groups.

## Code & devtools

- [Code block](https://tactileui.dev/parts/code-block): Code on display glass.
- [Install snippet](https://tactileui.dev/parts/install-snippet): One command, four package managers.
- [Terminal](https://tactileui.dev/parts/terminal): A command prompt on dark glass.
- [JSON viewer](https://tactileui.dev/parts/json-viewer): A tree of keys and values on display glass.
- [Diff view](https://tactileui.dev/parts/diff-view): Two versions of a file on display glass, side by side or stacked.
- [Log stream](https://tactileui.dev/parts/log-stream): A live log printed on a strip of paper tape.
- [Key-value editor](https://tactileui.dev/parts/kv-editor): Rows of a name and a value, each its own recess, with a remove key at the end of the row and an add key under the last: for environment variables, request headers, tags and the like.
- [Secret field](https://tactileui.dev/parts/secret-field): A masked value for an API key or a token, in the field’s well, with a reveal key and the kit’s copy key on its floor.

## Dialogs

- [Dialog](https://tactileui.dev/parts/dialog): A decision that must be made now: a native dialog with a question, one sentence of consequence, a way back and the act.
- [Command palette](https://tactileui.dev/parts/command): Every action and page behind one key: a modal plate whose entry line is a lit display, with the results printed below and the chosen one pressed in.
- [Drawer](https://tactileui.dev/parts/drawer): A panel that slides in from any edge of the window, on the native dialog.
- [Alert dialog](https://tactileui.dev/parts/alert-dialog): The dialog plate for a question that must be answered before an act that matters.
- [Bottom sheet](https://tactileui.dev/parts/bottom-sheet): A panel that rises from the bottom edge of the window, on the native dialog, for a short task that should not leave the page: add an expense, set some filters, pick an action.

## Dropdowns & menus

- [Menu](https://tactileui.dev/parts/menu): A card of actions and options that slides out from under its key.
- [Context menu](https://tactileui.dev/parts/context-menu): The menu’s own card, opened where you pointed: by right-click, by a long press on a touch screen, or from the keyboard with Shift F10 or the Menu key.
- [Menubar](https://tactileui.dev/parts/menubar): The row of menu names along the top of a window: File, Edit, View, Help.

## Empty states

- [Empty state](https://tactileui.dev/parts/empty-state): What a view shows before it has anything: an empty tray with the outline of what goes in it printed on its floor, one sentence and one key.
- [Empty tray](https://tactileui.dev/parts/empty-tray): An empty state drawn as an empty machined tray.
- [Error state](https://tactileui.dev/parts/error-state): What a view shows when loading failed.
- [Result](https://tactileui.dev/parts/result): The end of a task as one plate: a lens sunk into it with one lamp lit, a verdict, one sentence and what to do next.

## File trees

- [File tree](https://tactileui.dev/parts/file-tree): Folders and files as a real tree, printed like a wiring diagram: traces with an elbow into every item, chevrons that turn, and the chosen file set in a recess with its lamp lit.
- [Drawer index](https://tactileui.dev/parts/drawer-index): A file tree as a card-index cabinet.
- [Column browser](https://tactileui.dev/parts/column-browser): Folders as columns, side by side, the way a file manager’s column view browses them.

## File uploads

- [Drop zone](https://tactileui.dev/parts/drop-zone): An in-tray for files.
- [File field](https://tactileui.dev/parts/file-field): The browser’s own file input, dressed as a key and a printed file name in a well.

## Forms

- [Field](https://tactileui.dev/parts/field): Text entry in a recess, the label printed above it, and a hint that says how to fix an error.
- [Form validation](https://tactileui.dev/parts/validation): A form that says what is wrong, on the browser’s own checks.
- [Combo](https://tactileui.dev/parts/combo): One field with its one action in a shared well: subscribe, search, add.
- [Stepper](https://tactileui.dev/parts/stepper): A small integer with − and + keys either side, in one well.
- [Sign-in](https://tactileui.dev/parts/sign-in): Sign in and sign up on one plate: Google and GitHub keys with their marks stamped in monochrome, an email route underneath, a two-way selector that re-prints the plate, and errors that say how to fix them.
- [Scrub field](https://tactileui.dev/parts/scrub): A number you can type or drag, the way a pro tool’s value field works: an engraved ruler under the numerals slides beneath a fixed index as the value moves.
- [Tumbler lock](https://tactileui.dev/parts/tumbler): A PIN or one-time code dialled into a combination lock: number wheels behind a slot in the plate, turning on detents.
- [Log pad](https://tactileui.dev/parts/log-pad): A writing pad that is still a real textarea.
- [Cloth selector](https://tactileui.dev/parts/cloth-selector): A mode switch made of cloth.
- [Password field](https://tactileui.dev/parts/password-field): The field’s well with a louvred shutter drawn across its characters and a peek key at the end.
- [Fieldset](https://tactileui.dev/parts/fieldset): Related fields under one engraved legend, with one hint and one error line for the group.
- [Settings row](https://tactileui.dev/parts/settings-row): What a settings page is made of: a label, one sentence under it and the control at the end, ruled like the list with a hairline between rows and nothing else drawn.
- [Duration field](https://tactileui.dev/parts/duration-field): Each segment is a spin button with its unit printed beside it as a small suffix.
- [Colour picker](https://tactileui.dev/parts/color-picker): A form field for choosing a colour.
- [Phone field](https://tactileui.dev/parts/phone-field): A country key and a number in one well, for a contact number.
- [Money field](https://tactileui.dev/parts/money-field): An amount of money in the field’s well, with its currency printed on the floor at the left (the symbol and the code, or a native select when several are offered).
- [Rich editor](https://tactileui.dev/parts/rich-editor): A plain rich-text field with no dependency.

## Icons

- [Icons](https://tactileui.dev/parts/icons): The kit’s glyphs as one set.
- [Icon picker](https://tactileui.dev/parts/icon-picker): A key that shows the icon it holds, with a clear key beside it, and that opens a card of the kit’s own icons to change it.

## Inputs

- [Combobox](https://tactileui.dev/parts/combobox): A field that filters a long list as you type.
- [Input group](https://tactileui.dev/parts/input-group): One recess that holds a field and everything that belongs to it.
- [Search field](https://tactileui.dev/parts/search-field): A recess for a question.
- [Inline edit](https://tactileui.dev/parts/inline-edit): A printed label that becomes a field when you press it.
- [Multi-select](https://tactileui.dev/parts/multi-select): A combobox that takes several.

## Knobs

- [Knob](https://tactileui.dev/parts/knob): A rotary control for continuous or stepped values where space is square.
- [Setup dial](https://tactileui.dev/parts/setup-dial): Onboarding as the program dial of an appliance on its first run.

## Lists

- [List](https://tactileui.dev/parts/list): Rows in a rack: a mark, a title, a second line and a fact or a key at the end.
- [Sortable list](https://tactileui.dev/parts/sortable): Plates in a rack that you reorder.
- [Listbox](https://tactileui.dev/parts/listbox): An always-open list let into the plate as a recess.
- [Virtual list](https://tactileui.dev/parts/virtual-list): A list for thousands of rows that stays quick because it only ever draws the ones you can see, and a few either side.

## Media frames

- [Lightbox](https://tactileui.dev/parts/lightbox): A grid of thumbnails that opens one picture large.
- [Aspect ratio](https://tactileui.dev/parts/aspect-ratio): A frame that holds one shape, whatever is put in it.
- [Media bar](https://tactileui.dev/parts/media-bar): The control bar for an audio or video element.

## Loaders

- [Skeleton](https://tactileui.dev/parts/skeleton): The shape of a page before its data arrives, drawn as the unprinted plate: blank engraved bars where the words will print.
- [Spinner](https://tactileui.dev/parts/spinner): A ring of eight lamps lit in turn, a chase round a dial: each lamp is a dim cap with its light laid over it, and the light fades as the chase passes on, leaving a short tail.
- [Loading overlay](https://tactileui.dev/parts/loading-overlay): A pane of smoked glass laid over a panel while it works.

## Navigation

- [Bar](https://tactileui.dev/parts/bar): The top of a page: a wordmark with a lamp, printed links, and one contrast key at most.
- [Side rail](https://tactileui.dev/parts/side): App navigation in a panel: the current page is a recess with its lamp lit, links grouped under printed labels.
- [Icon rail](https://tactileui.dev/parts/icon-rail): A narrow sidebar of icon keys, using the kit’s own icons.
- [Tabs](https://tactileui.dev/parts/tabs): Views of the same thing, switched in place: keys in a tray, the chosen view a raised cap.
- [Pagination](https://tactileui.dev/parts/pagination): Pages for tables and lists: numbered keys in a tray with the current page latched down, seven slots so the row never changes width.
- [Page wheel](https://tactileui.dev/parts/page-wheel): Pagination as a thumbwheel.
- [Link](https://tactileui.dev/parts/link): Printed type that goes somewhere.
- [Breadcrumb](https://tactileui.dev/parts/breadcrumb): The trail of levels above this page, printed across the top like the path an instrument shows over its menu screen: SETTINGS › BILLING › INVOICES.
- [Navigation menu](https://tactileui.dev/parts/navigation-menu): The links at the top of a site.

## Notifications

- [Notifications](https://tactileui.dev/parts/notifications): A key with a counter window in its cap, and a card of messages hung from it.
- [Ticket toast](https://tactileui.dev/parts/ticket-toast): A toast issued like a numbered ticket from a dispenser.

## Numbers

- [Readout](https://tactileui.dev/parts/readout): A printed label over a value: key figures, with the unit small and the change in words.
- [LCD](https://tactileui.dev/parts/lcd): A value that changes, on grey-green liquid crystal, with a ghost of the unlit segments behind it: clocks, battery, counters.
- [VFD](https://tactileui.dev/parts/vfd): A vacuum-fluorescent display: cyan-white light on near-black glass, with a glow and a ghost.
- [Stat tile](https://tactileui.dev/parts/stat-tile): One headline number with its label, how it moved against another period and, if you give it readings, the small line of the run behind it.

## Onboarding

- [Onboarding](https://tactileui.dev/parts/onboarding): Setting something up: stations along a groove (done ones with their lamp lit, the current one a raised cap) and a checklist of check keys with a progress slot.
- [Tour](https://tactileui.dev/parts/tour): A product tour.

## Popovers

- [Popover](https://tactileui.dev/parts/popover): A card hung from the key that opened it, with a printed leader running back to the key.
- [Popconfirm](https://tactileui.dev/parts/popconfirm): A small card that asks before a click does its work, hung from the key that opened it.

## Progress

- [Progress](https://tactileui.dev/parts/progress): Progress through a task: ink filling a groove, never a coloured bar.
- [Ladder](https://tactileui.dev/parts/ladder): An LED ladder for levels and load: green, then amber, then red, the way a recording level has always been read.
- [Meter](https://tactileui.dev/parts/meter): A value inside a known range, read off an LED strip.
- [Battery](https://tactileui.dev/parts/battery): A cell outline with a terminal at one end, filled with lamp segments set into a recess, lit from the empty end.
- [Pipeline](https://tactileui.dev/parts/pipeline): The stages of a build and a deploy as stations along a groove, like the program track of a machine.

## Radio groups

- [Radio](https://tactileui.dev/parts/radio): One choice from a short list in a form: small round keys in a fieldset, the chosen one pressed with a printed dot.
- [Selector](https://tactileui.dev/parts/selector): One mode of two to five: latching keys in a tray, one down at a time, each with a lamp that lights when chosen.
- [Segmented control](https://tactileui.dev/parts/segmented): A row of keys in a tray with one pressed down: pick a view, a range or a mode and it applies at once.
- [Rating](https://tactileui.dev/parts/rating): A row of indicator lamps, each in its own round recess, lit up to your score.

## Receipts & tickets

- [Receipt](https://tactileui.dev/parts/receipt): The record of a payment, printed on a slip of thermal paper: who was paid, the receipt number, when and with what, the lines and the sums, any refunds, and a rubber stamp that says where it stands, Paid, Part refunded, Refunded, Due or Void, with a lamp beside the word.

## Scroll areas

- [Scroll area](https://tactileui.dev/parts/scroll-area): A region that scrolls, with its scrollbar made as a machined rail: a groove cut into the plate and a thumb like a fader cap riding in it.
- [Loupe scroll](https://tactileui.dev/parts/loupe-scroll): A scroll area whose scrollbar is a map of what it holds.
- [Page loupe](https://tactileui.dev/parts/page-loupe): A map of the whole page, for the corner beside it.

## Selects

- [Select](https://tactileui.dev/parts/select): A choice from a longer list, in the same recess as a field, with a printed chevron.
- [Tree select](https://tactileui.dev/parts/tree-select): A select whose list is a tree, for a folder, a category or a team that sits inside others.

## Sliders & faders

- [Fader](https://tactileui.dev/parts/fader): A continuous value along a line: a native range whose cap rides in a slot cut into the plate, with a printed scale.
- [Range](https://tactileui.dev/parts/range): Two fader caps in one slot, for a span between a low value and a high one: a price band, quiet hours, a frequency band.

## Spec lists

- [Spec list](https://tactileui.dev/parts/spec): Key and value facts, printed like the plate on the back of a device.
- [Order summary](https://tactileui.dev/parts/order-summary): The priced lines of an order, printed like a till slip: a name, a unit price, a quantity and a line total on each, then a ruled block of totals in the spec list’s hand with the subtotal, any discounts as cuts, shipping, tax and a total set heavier under a double rule.

## Tables

- [Table](https://tactileui.dev/parts/table): Rows of data with printed column labels, figures right-aligned in columns, and status in lamps with words.
- [Data table](https://tactileui.dev/parts/data-table): The kit’s table with the tools a working one needs: headers that sort, a filter well, a check key on every row with one in the header that selects them all and sinks half way when only some are chosen, and a header that stays at the top while the rows scroll under it.
- [Data grid](https://tactileui.dev/parts/data-grid): A table you edit in place, the way a spreadsheet is edited.
- [Table toolbar](https://tactileui.dev/parts/table-toolbar): The strip over a table: a search well, filter keys that latch, a menu to choose which columns show, and the count of rows in view (“8 of 8 bookings”).
- [Bulk bar](https://tactileui.dev/parts/bulk-bar): The bar that slides up when rows are checked.
- [Compare table](https://tactileui.dev/parts/compare-table): Plans or products as columns, features as rows, for the decision that is made by lining things up.

## Text areas

- [Text area](https://tactileui.dev/parts/textarea): Longer text in a deeper recess: notes, messages, descriptions.
- [Mention field](https://tactileui.dev/parts/mention-field): A text field for comments, notes and chat where typing @ opens a short list of people, and # a list of topics, hung under the caret.

## Timelines

- [Timeline](https://tactileui.dev/parts/timeline): An event log like the roll of a chart recorder.
- [Day agenda](https://tactileui.dev/parts/day-agenda): One day in hour rows, like a page of a desk diary.

## Toasts

- [Toast](https://tactileui.dev/parts/toast): A confirmation after an action: a small plate with a lamp and one factual sentence, read out politely, gone in 3.6 seconds.
- [Progress toast](https://tactileui.dev/parts/progress-toast): A toast that carries a job running in the background, an export, an import or a sync, from its start to its end.

## Toggles & switches

- [Switch](https://tactileui.dev/parts/switch): On or off, applied the moment it moves.
- [Rocker](https://tactileui.dev/parts/rocker): A heavier on/off for power, mains and arming: a cap that pivots in a black bezel, printed | and O.
- [Toggle group](https://tactileui.dev/parts/toggle-group): The segmented control’s keys, each latching on its own, so any number can be down at once: bold and italic, the columns a table shows, the filters on a log.

## Tooltips

- [Tooltip](https://tactileui.dev/parts/tooltip): A few words on a small label plate, the kind riveted beside a control on a rack: printed in the contrast colours with a rule just inside its edge and a short tab aimed at its key.
- [Toggletip](https://tactileui.dev/parts/toggletip): A small round key beside a label that, when pressed, hangs a sentence or two about it on a label plate and says them aloud.