Dev Design Library

SwiftPieces components

Swift Pieces provides a library of designed SwiftUI components featuring integrated motion, haptics, and states. Developers can easily integrate these elements via a single Swift file, CLI tool, or AI-assisted installation.

Components
85
Framework
SwiftUI
Stack
SwiftUI
License
MIT + Commons Clause
GitHub stars
284
Source
https://github.com/Saivion/SwiftPieces
Website
https://swiftpieces.com

All SwiftPieces components

  • Activity Heatmap: A streak calendar in steps of red with a glass streak chip, and a scrub that lifts each day with a callout and a haptic tick.
  • Address Field: An address field whose suggestions pour out as a glass list and resolve into a structured address with street, city and coordinate.
  • Amount Field: A currency entry that formats live in the user's locale as each digit rolls in, pastes cleanly and refuses amounts over the limit.
  • Assistant Orb: A dark glass ball with a Siri-style voice wave inside, drawn by a Metal shader and locked to the thinking state.
  • Attachment Tray: An attachment strip for composers: a glass add tile opens the photo picker and each pick lands as a tile with a live progress ring.
  • Choice Group: Radio and checkbox rows on a glass card: one red drop flows from ring to ring, and checked boxes flood red with a popping check.
  • Commit Button: An async action button in liquid glass that runs through loading, success and error, with a progress bubble budding out of its end.
  • Confirm Sheet: A confirmation card as a bottom sheet or an inline card, its confirm and cancel splitting out of one glass shape as it lands.
  • Date Range Picker: A start-to-end date range picker on a paged month grid, the range pouring between two glass bubbles like liquid.
  • Date Strip: A week of dates in a row from the user's calendar: the red pill flows to the day you tap, and swiping pages by week.
  • Depth Carousel: Paged cards that recede in depth as they leave the centre, over a glass page counter and a track you can scrub.
  • Drag Select Grid: A photo and file grid where one drag selects a whole range like the system photo library, auto-scrolling at the edges with a tick per item.
  • Drag To Dismiss: A modifier that lets a photo, card or sheet follow the drag, then springs it back or tosses it away at the speed of the flick.
  • Elastic Button: A button style that squashes toward the touch, stretches with the drag, deepens on a hold and springs back with the give you put in.
  • Expandable Text: A paragraph clamped to a line limit that shows a glass more pill only when it is cut, and grows to full height without reflow.
  • Expanding Track: A thumbless glass slider that swells under the finger and buds a readout bubble that rides the edge, for a value or a range.
  • Fan Stack: Overlapping avatars in glass bubbles that fan apart on tap and scrub under the finger, a name tag budding out of the one you hold.
  • Filter Rail: A scrolling rail of glass filter chips for one pick or many, with a red puck that stretches between chips and a Clear chip.
  • Flip Card: A two-sided card you flip by tap or drag, scrubbing the turn and carrying the flick into the landing, with a lift and a moving shadow.
  • Floating Dock: A floating glass dock where each item is its own bubble; drag across it to lift each item and read its name, release to switch.
  • Follow Scroll: A chat and feed container that stays pinned to the newest item, counting new ones into a glass pill once you scroll up to read.
  • Form Field: A liquid glass text field with a floating label, a clear bubble, a character counter and validation that waits until you leave.
  • Glass Action Menu: Hold the glass trigger and its actions bud out of it along a line or an arc; slide across them and release to fire one.
  • Glass Mode Bar: One liquid glass bar that turns into the mode you pick, its icons trading places with that mode's own controls.
  • Glass Quick Add: A liquid glass Quick add pill that grows into a menu of capture kinds, then re-forms in place into the capture you pick.
  • Glass Segments: A segmented control whose glass indicator moves like liquid, stretching across and gathering in, and follows a scrub.
  • Glass Surface: The SwiftPieces liquid glass as a modifier: any view on a glass shape, neighbours melted together, with fallbacks before iOS 26.
  • Glass Text: Liquid Glass drawn on the actual letter shapes of a string, with fallbacks before iOS 26 and under Reduce Transparency.
  • Hold To Confirm: A press-and-hold glass capsule for destructive actions that fills as you hold, ticks past milestones and confirms with a check.
  • Index Scrubber: An A to Z index on a glass rail that jumps through a long list as you drag, with a letter bubble that follows the finger.
  • Interest Chips: Wrapping glass chips for picking several things: each floods red as its check grows in, and a limit dims the rest and shakes refusals.
  • Level Picker: A stepped slider for a few named levels: the red thumb rides a glass track, ticks at each stop and settles where a flick would land.
  • Link Preview: A rich card for any URL that holds its size while it loads, then settles the page's image and title under a glass host chip.
  • Liquid Switch: A toggle whose red fill pours across a glass track as the thumb crosses, swelling under the finger, with a drag that follows and flips.
  • Live Stat: A metric tile whose value rolls with a spring, with a delta chip and a sparkline you scrub to read any point live.
  • Location Picker: A map picker with a red pin that lifts while the map moves and drops into place, looking up the address under it on a glass card.
  • Motion Card: A solid colour card that tilts with the device, catching a fixed light across its face and its glass chips, and settles flat when pressed.
  • Notice Stack: In-app notices stacked like notifications: the newest on top, a tap spreads the pile, and cards swipe away at your speed.
  • Now Playing: A mini player that grows into the full player in one liquid glass motion, with scrubbing, skips and a drag to fold it back.
  • Odometer: A number whose digits roll on their own slots like a mechanical counter, with a glass delta chip that buds out after each change.
  • Outcome Screen: A success, failure or empty state in one choreography: a ring draws, floods and lands with a haptic, then a glass action rises.
  • Page Dots: A page control whose red capsule pours from dot to dot, with tap and scrub to jump and an autoplay timer that fills the capsule.
  • Paged List: An infinite-scroll list that prefetches and drops duplicate and stale pages, with a glass footer for loading, retry and the end.
  • Parallax Card: An image card whose picture and liquid glass caption drift at different speeds as you scroll, so the card reads in layers.
  • Permission Sheet: A pre-permission sheet that previews what it brings as a stack of notification banners before the request.
  • Photo Cropper: A crop step for profile photos and posts with pinch, pan and aspect presets, rendering the crop off the main thread at full size.
  • Photo Viewer: A full-screen photo viewer with anchored pinch zoom, momentum panning, paging and drag to dismiss under glass controls.
  • Picture Headline: A headline with living pictures stuck between its words like a collage, each opening into a tilted sticker as the words rise.
  • Prompt Chips: Liquid glass prompt chips above a composer that cascade in, then melt into the one you tap as it drops its text into the field.
  • Range Lens: An overview and detail chart for long series: drag and resize a glass lens over the whole range to read the window's average.
  • Range Slider: A dual-thumb slider: glass bubble thumbs joined by a tinted span, readout chips that merge as they meet, and steps that tick.
  • Rating Scrub: A star rating you tap or scrub: the stars fill and rise under the finger while a glass readout rides along and the label morphs.
  • Reaction Toggle: A like or save toggle in liquid glass that floods with its tint, springs its symbol, rolls the count and buds a confirmation pill.
  • Ring Breakdown: A composition ring you scrub by dragging around it, lifting each slice with a haptic while its name and share morph in the centre.
  • Scroll Island: A floating glass island that names the section in view, rings in how much is read and opens into a contents panel on tap.
  • Scrub Chart: A line or bar chart you scrub under a glass flag, hold to select a range, and switch with a glass picker that morphs the line.
  • Scrub Stepper: A glass stepper you tap, hold to repeat or scrub sideways across, with buttons that melt into the pill at a bound.
  • Secure Entry: A glass password field with a reveal bubble, a strength chip and requirement chips that turn sage with a check as each rule passes.
  • Signature Pad: A signature field with smooth, velocity-weighted ink and a glass toolbar for undo and clear, exporting to PNG or vector PDF.
  • Silk: A slowly folding silk surface shaded in Metal and lit by a movable light, in the house fabrics, with optional tilt lighting.
  • Skeleton Loader: Placeholder bones and a modifier that turns any layout into one sweeping shape, then hands off as the content rises in.
  • Source Stack: Citations for an AI answer: a pill of overlapping site badges that opens into a list of numbered source cards.
  • Spotlight Tour: A first-run feature tour that dims the screen around each control, with a glass callout that steps from stop to stop.
  • Status Morph: One stroke that spins while loading, then closes into a ring and draws a check on success or a cross on failure.
  • Status Timeline: A vertical status timeline on glass nodes: the live one breathes, done ones stamp to a check, and details bud out of a node.
  • Step Trail: A glass progress trail for checkout and setup flows, the red current step stretching to the next as you move on.
  • Story Strip: A Stories-style segment strip with its own clock, hold to pause, and tap zones for back and forward.
  • Streaming Reply: The AI reply in liquid glass: text that streams in word by word under a morphing phase label, with copy, regenerate and retry.
  • Stretch Header: A hero header that stretches on overscroll, shrinks its title toward the navigation bar and pins a row of glass stat pills.
  • Swatch Picker: A row of named color swatches whose selection ring flows to the one you tap, with a check in whichever ink reads on it.
  • Swipe Action Row: Any row in a glass card whose swipe actions bud out as tinted bubbles, with a full swipe that commits and one row open at a time.
  • Swipe Deck: A card stack you swipe: the top card follows the finger, a glass outcome badge stamps at the threshold and a flick throws it away.
  • Task Row: A task card whose glass check pops as it completes, with a priority chip, swipes to complete, snooze or delete, and drag to reorder.
  • Text Reveal: Reveals a headline by characters, words or lines, then grows a stroke of tinted glass behind the phrases that matter.
  • Thinking State: The assistant-is-working placeholder: a glass header with a breathing mark and elapsed seconds over dots, bars or a sheen.
  • Thought Orb: A small glass orb with a voice wave whose colour follows the kind of work, and a glass status pill whose verb morphs as it changes.
  • Time Slot Picker: Bookable times as glass pills in a grid: the red selection flows across and down to the time you tap, and taken times shake.
  • Timer Dial: A countdown ring you set by dragging a glass knob around it, with a tick per step, a warning zone and start, pause and reset bubbles.
  • Toast: A single liquid glass toast with a tile tinted for its kind, a countdown ring that pauses on touch and an optional Undo.
  • Token Field: A tag and recipient field where each entry buds out of the glass input as a chip, with checks, suggestions and backspace to remove.
  • Touch Grid: A dot grid that swells and warms in colour under the finger, springs back on release and sends a ripple out from a tap.
  • Tracking Tabs: Tabs on a glass track over paging content, with a tinted indicator that rides the scroll and title ink that turns under its edge.
  • Voice Recorder: Hold to record a voice message: the glass mic swells into a recording capsule; slide to cancel or lock, let go to send.
  • Wallet Stack: A wallet of passes stacked by their header strips: tap one to open its whole face and a real scannable code, then put it back.
  • Waveform Scrub: A voice note player whose waveform is the scrubber, with a glass time bubble that rides the finger and a playback speed chip.

Browse by category