Component directory
Browse every Fieldbook component by category and name. Open components and member previews link to their individual pages.
Animation
- Blur reveal
- Bobble tile grid
- Burst particle emitter
- Celebration burst
- Circular wipe switcher
- Coiled Spring Drag
- Color blend compare
- Compass bar grid
- Composable Reveal
- Connector Pulse Beam
- Crackling border frame
- Crank sea automaton
- Diagonal Glare Sweep
- Directional Slide In
- Dismiss exit card
- Drag tile track
- Easing preview tile
- Entrance timing playground
- Focus in reveal
- Focus Lens
- Gooey blob field
- Icon Shape Morph
- Interruptible hover swell
- Iron filings field
- Keyframe morph loop
- Leaded glass lancet
- Liquid chrome emblem
- Magnetic pull target
- Morphing icon loop
- Morphing icon toggle
- Mount pop in
- Number reel
- Odometer number
- Orbiting Avatar Intro
- Orbiting badges
- Particle spray
- Path follower
- Path Orbit
- Peelable sticker
- Pixel Curtain
- Pointer Magnet
- Pointer tilt card
- Press and hover scale tile
- Press response tile
- Resonant sand plate
- Ring bloom
- Rubber sheet panel
- Scale in on view
- Shape toggle morph icon
- Spin count tile
- Spring easing toggle
- Spring tuner
- Stagger bar row
- Staggered Fade List
- Stroke drawing board
- Swap timing modes
- Tile reveal swap
- Tilting cube field
- True hover swatch
Backgrounds
- Assistant Ripple Glow
- Aurora band glow
- Aurora curtain
- Aurora veil
- Automaton loom
- Backlight Halo
- Bar wave matrix
- Blinking grid pattern
- Bouncing sphere pit
- Branching bolt
- Bulging dot field
- Combed ink marbling
- Comet rain
- Concentric pulse rings
- Contour Field
- Corner light rays
- CRT terminal static
- Cursor fluid trail
- Cursor trail grid
- Diagonal Hatch Field
- Drifting border sheen
- Drifting glass shards
- Drifting gradient wash
- Drifting Light Beams
- Drifting particle field
- Drifting starfield
- Fanned wave threads
- Film grain overlay
- Firework burst canvas
- Flaming iris eye
- Flickering glyph grid
- Flickering square mesh
- Flowing line currents
- Funnel vortex backdrop
- Glyph Static Backdrop
- Gradient slat spotlight
- Grain Flicker
- Grain wash
- Graph paper grid
- Gravity dust field
- Halftone ripple field
- Halftone wave field
- Halo ring
- Hex cell grid
- Honeycomb lattice
- Horizon swell
- Iridescent sheen
- Light Beam Flare
- Light beam slats
- Light column beam
- Light cone beam
- Light Threads
- Liquid metal drift
- Liquid metal swirl
- Liquid swirl vortex
- Luminous ribbon field
- Magnetic particle ring
- Merging blob backdrop
- Meteor shower
- Mirror warp field
- Neon ribbon tubes
- Orbiting border spark
- Overhead light rays
- Parallax Starfield
- Particle drift
- Particle Field
- Perspective floor grid
- Pixel snowfall
- Plasma plume
- Pointer angle sweep
- Pointer lit lattice
- Pointer ripple mesh
- Prismatic light bands
- Pulse grid mesh
- Pulsing Dot Field
- Radial cable pulses
- Radial light burst
- Raked sand garden
- Reaction diffusion relief
- Refractive Glass Panel
- Ribbon light streams
- Scanning wire grid
- Scrolling tile lattice
- Shockwave dot grid
- Signal sweep bands
- Smoke veil drift
- Soft fiber curtain
- Spotlight shafts
- Survey route map
- Sweep scope
- Tilted tile parallax
- Tube screen plasma
- Tunnel Warp Panel
- Vector Flow Field
- Warp lane streaks
- Warped line flow
- Warped tile tunnel
- Wire Curtain
- Woven silk drape
Blocks
- Access request inbox
- Agent run workspace
- API key lifecycle panel
- Artifact version diff
- Audit event timeline
- Bulk edit review
- Column visibility picker
- Connected apps manager
- Context attachment tray
- CSV import mapper
- Customer context sidebar
- Delegation task board
- Escalation timeline
- Export job center
- Feedback priority board
- Filter rule builder
- Hero signal
- Human approval inbox
- Import validation report
- Interactive product tour
- Job queue monitor
- Knowledge results
- Log query explorer
- Model capability picker
- Onboarding checklist
- Purchase approval chain
- Record detail drawer
- Reply composer with macros
- Retry recovery panel
- Run history table
- Run step timeline
- Saved view data grid
- Service status overview
- Sla deadline meter
- Source citation panel
- Subscription change preview
- Support inbox workspace
- Ticket triage list
- Token budget meter
- Tool call inspector
- Usage pricing
- Webhook delivery inspector
Cards
- Anchored site preview
- Bevel Edge Panel Card
- Bouncing Photo Fan
- Brushed Metal Pass
- Card Shuffle Stack
- Cursor drift link preview
- Deferred post card
- Edge tracking glow card
- Fanning Spec Stack
- Flip reveal card
- Hairline Note Card
- Holographic ID card
- Hover preview popover
- Inline term preview
- Invitation review panel
- Link thumbnail peek
- Link thumbnail peek
- Link Thumbnail Peek
- Nested panel frame
- Payment recovery panel
- Pixel Bloom Card
- Pointer spotlight card
- Pointer Spotlight Panel
- Pointer tilt photo card
- Profile flip card
- Profile hover card
- Refracted glass player
- Repelling dot field card
- Sheen sweep card
- Slotted panel card
- Social Post Card
- Spotlight card
- Swipe photo stack
- Threaded post card
- Tilt card
- Tilt Parallax Tile
- Tilt Spotlight Grid
- Traveling edge glow card
- Turbulence Decay Card
Charts
- Activity cell heatmap
- Animated Time Axis
- Animated Value Axis
- Area chart lite
- Candle Price Chart
- Category dot line
- Chart Plot Texture
- Chart reference band
- Chip legend pie
- Concentric Ring Chart
- Concentric Ring Radar
- Donut share chart
- Donut with total
- Dotted Trend Line
- Drill-Down Sunburst Chart
- Edge Faded Plot Grid
- Engraved label pie
- Fanning event markers
- Flow Area Chart
- Flow Sankey Diagram
- Forecast tail line
- Glass Block Bars
- Glyph Marker Line
- Gradient Area Chart
- Gridline area chart
- Grow bar chart
- Highlight trail chart
- Highlighted bar chart
- Horizontal bar chart
- Inline labeled bar chart
- Layered trend chart
- Leader line pie
- Metric switch bar chart
- Named point line
- Notched arc gauge
- Outside Value Pie
- Paired bar chart
- Paired Series Line
- Plain Share Pie
- Plain trend line
- Profit/Loss Line Chart
- Raised Slice Donut
- Range filter area chart
- Range Filtered Bar Report
- Ranked Share Bar Chart
- Region heat map
- Revenue Area Card
- Rounded bar chart
- Scrubbing tooltip chart
- Seamless share pie
- Series icon area chart
- Series Legend List
- Series Switch Trend
- Sessions Line Card
- Share Of Total Area Chart
- Signed value bar chart
- Single Hoop Radar
- Slice picker donut
- Smooth Area Trend
- Spark line
- Spend breakdown chart
- Spoke area chart
- Spoke Radar Plot
- Spokeless Ring Radar
- Stacked Area Chart
- Stacked segment bar chart
- Step area chart
- Stepped Value Line
- Straight Segment Area Chart
- Straight segment line
- Streaming signal line
- Tapered Funnel Stages
- Themed chart frame
- Timeline scatter chart
- Tinted ring radar
- Tinted web radar
- Twin ring chart
- Two series area legend
- Value labeled line
- Value tagged bar chart
- Vertex Dot Radar
- Wedge Pop Pie
- Wiping multi series line
Cursor
- Bracket lock cursor
- Floating text trail
- Fluid Splash
- Gooey blob trail
- Lagging orb follower
- Magnetic project target
- Neon trail cursor
- Pixel Wake
- Pointer label cursor
- Pointer takeover zone
- Ribbon trail flow
- Smoke trail cursor
- Spring lag trail
- Stamped cursor trail
- Swarm trail cursor
- Tile trail
- Tracking crosshair overlay
- Trailing cursor
- Velocity comet trail
- Zoned cursor tag
Data display
- Animated metric counter
- Auto-Scroll Message List
- Avatar Lineup Hover
- Avatar Stack
- Before/After Code Diff
- Billing Ledger Table
- Card Style Invoice Table
- Chat message thread
- Chevron accordion list
- Concentric goal rings
- Content Divider Rule
- Conversation bubbles
- Count wheel badge
- Counting metric
- Counting number readout
- Counting readout
- Credit balance ledger
- Detail list item
- Dotted World Map
- Drag reorder checklist
- Endless Feed Loader
- FAQ Accordion
- File attachment chip
- Filterable record table
- Git status file tree
- Glide highlight explorer
- Guide steps accordion
- Hairline section divider
- Height Morph Accordion
- Initials avatar cluster
- Initials fallback avatar
- Labeled hairline divider
- Masked Reveal Accordion
- Multi open panel stack
- Nested File Browser
- Nested file tree
- Notification feed stack
- Odometer digit counter
- Pin priority list
- Pin to top list
- Presence Avatar Clusters
- Quiet File Tree
- Reflowing Notification Stack
- Rolling stat tiles
- Seat management table
- Settings Group Accordion
- Shortcut key chip
- Shortcut Key Chip
- Single Panel Disclosure
- Sliding digit counter
- Social proof avatar row
- Spring Push Collapsible
- Stacked FAQ accordion
- Starred repos disclosure
- Status Avatar
- Team permission matrix
- Timeline marker row
- Toggle Reveal Panel
- Typewriter code block
- Typewriter code panel
- Visitor Map Card
Feedback
- Breathing dot loader
- Click ripple burst
- Click spark burst
- Content Loading Card
- Count badge cluster
- Curtain line loader
- Dot matrix status pill
- Empty State Panel
- Empty State Panel
- Expanding ring loader
- Fill progress loading text
- Fill sweep loading text
- Hairline Tone Badge
- Hopping dot loader
- Infinite loop path loader
- Labeled progress bar
- Layered ring loader
- Left Rule Notice
- Loading Placeholder Blocks
- Milestone progress track
- Plan limit alert
- Progress ring
- Quiet Ring Spinner
- Scroll Position Progress Bar
- Segment Fade Spinner
- Segmented progress meter
- Single glyph spinner
- Solid Ring Spinner
- Spring Fill Progress
- Stacked Alert Toasts
- Stacked notification drawer
- Stacked notification tray
- Status Alert Banner
- Status cycle pill
- Step goal progress bar
- Sweeping progress bar
- Task Log Loader
- Threshold level meter
- Toast stack
- Tone Pill Label
- Tone Rule Alert
- Transfer status card
- Upload Progress Line
Forms
- Branded Code Panel
- Code cover card
- Control Bench
- Environment variable editor
- Field with status icon
- Focus Guard Form
- Grouped Code Boxes
- Grouped Section Fieldset
- Labeled field block
- Notification preferences
- One Question Wizard
- Paired Code Split View
- Quantity Stepper Field
- Quote builder
- Release notification form
- Scribble strike checklist
- Scrub Number Input
- Tall Code Keypad
- Validated Signup Form
- Verification Code Card
Icons
- 3D axis icon
- Accessibility icon
- Activity icon
- Airplay icon
- Alarm clock icon
- Arrow icon
- Audio lines icon
- Badge check icon
- Battery icon
- Bell icon
- Between icon
- Blocks icon
- Cast icon
- Check icon
- Chevron icon
- Clapperboard icon
- Clipboard icon
- Clock icon
- Cog icon
- Compass icon
- Copy icon
- Corner arrow icon
- Crop icon
- Cross icon
- Disc icon
- Download icon
- Ellipsis icon
- EV charger icon
- Expand icon
- External link icon
- Fingerprint icon
- Frame icon
- Gallery icon
- Gauge icon
- Heart icon
- Kanban icon
- Key icon
- Layers icon
- Layout dashboard icon
- Link icon
- Loader icon
- Log in icon
- Log out icon
- Map pin icon
- Maximize icon
- Menu icon
- Minimize icon
- Minus icon
- Morph menu icon
- Move icon
- NFC icon
- Not equal icon
- Orbit icon
- Orbit loader
- Panel icon
- Paperclip icon
- Pause icon
- Pin icon
- Play icon
- Plug zap icon
- Plus icon
- Radio icon
- Radio tower icon
- Refresh icon
- Rotate icon
- Route icon
- Search icon
- Send icon
- Settings icon
- Shrink icon
- Signal icon
- Sliders icon
- Star icon
- Thumbs icon
- Timer icon
- Toggle icon
- Trash icon
- Unplug icon
- Upload icon
- Volume icon
- Wifi icon
- X mark icon
Inputs
- Addon Input Group
- Appointment Range Card
- Appointment Scheduler Card
- Auto Grow Textarea
- Autosize text field
- Avatar profile picker
- Before/After reveal handle
- Birthdate popover picker
- Booked Dates Picker
- Bounce drop toggle
- Bounded Stay Range Picker
- Caption Style Date Picker
- Character budget counter
- Check draw toggle
- Checkbox motion lab
- Checkmark draw checkbox
- Clean Text Field
- Combobox field
- Command search palette
- Compact select menu
- Compact Time Range Picker
- Curved input bar
- Date and Time Duo Picker
- Date Range Picker
- Date Range Picker
- Day Agenda Calendar
- Directional theme wipe
- Dot radio list
- Drawn check checkbox
- Dropdown Date Picker
- Dropdown Date Time Picker
- Dual Month Date Picker
- Editable date field
- Elastic toggle switch
- Elastic tug slider
- Exposure dial slider
- Filtered suggestion field
- Floating label input
- Focus ring text input
- Friendly Date Range Picker
- Future-Only Date Picker
- Grouped select menu
- Icon crossfade switch
- Input with affix
- Labeled checkbox
- Labeled radio group
- Labeled toggle row
- Latching square toggle
- Layout toggle switch
- Localized booking calendar
- Meeting Slot Scheduler
- Minimal Single Date Picker
- Minimum-Stay Range Picker
- Mobile date drawer
- Model picker prompt box
- Month grid date picker
- Multi select toggle row
- Multi-Date Picker
- Natural Language Date Field
- Orbit drop zone
- OTP code boxes
- OTP field
- Passcode slot input
- Plan radio list
- Preference checklist
- Priced stay range calendar
- Quick Pick Date Card
- Radio dot select
- Range span slider
- Search Composer Field
- Searchable Select
- Seasonal Range Picker
- Segment Spring Lab
- Segmented choice bar
- Select All Checklist
- Settings Toggle Row
- Settings toggle switch
- Shape wipe theme toggle
- Single Date Grid
- Single value slider
- Sliding highlight toggle group
- Sliding segment toggle
- Sliding Thumb Switch
- Spring dot radio group
- Spring layout toggle
- Springing radio group
- Stacked option checklist
- Stay Dates Picker
- Stay range popover picker
- Styled native dropdown
- Sun Moon Switch
- Switch Spring Lab
- Tag chips field
- Team size stepper
- Text field
- Text style toggle group
- Thumb icon switch
- Todo strike checkbox
- Tri-state checkbox
- Two-Month Range Picker
- Vertical brightness slider
- Vertical choice dial
- Voice Capture Button
- Weekday-Only Range Picker
Layout
- Curved Scroll Wall
- Drag split panels
- Expanding panel gallery
- Fading edge scroll panel
- Focus scroll list
- Inner Dome Viewer
- Locked ratio frame
- Masked reveal disclosure
- Masonry flow
- Overlay scroll panel
- Peek Inside Folder
- Pinned Card Stack Scroll
- Progressive edge blur
- Reactive bento panels
- Receding stack carousel
- Ripple Origin Grid
- Settling photo masonry
- Split panes
- Spotlight profile grid
- Spring drag carousel
- Swipe away card deck
Marketing
Media
- Android device frame
- Browser window frame
- Cursor magnifier lens
- Experience Shelf
- Fogged window
- Halftone print loupe
- Hover zoom frame
- Interactive spin globe
- iPhone Device Frame
- Morph image carousel
- Orbiting image spiral
- Parallax photo columns
- Pixel mosaic reveal
- Ripple lens
- Sequential terminal log
- Swipeable slide deck
Overlays
- Account Dropdown Menu
- Account Menu Flyout
- Anchored detail popover
- Anchored info popover
- Anchored popover card
- Anchored settings popover
- App folder expand
- Banner header dialog
- Blocking alert dialog
- Bottom sheet panel
- Bounce warning dialog
- Bulk action toolbar
- Button-to-dialog morph
- Card to fullscreen modal
- Centered modal frame
- Checkable action menu
- Command palette
- Command Palette Search
- Confirm action dialog
- Confirm action modal
- Confirm Delete Modal
- Consequence confirm dialog
- Cursor-chasing tooltip
- Custom shell lightbox
- Destructive confirm dialog
- Dismissible Dialog
- Drag Dismiss Bottom Drawer
- Edge aware popover
- Edge slide sheet
- Edge-slide panel
- Edge-tilt alert modal
- Flip Side Hint Tooltip
- Focus-Trapped Modal Kit
- Grouped backdrop popover
- Grouped filter popover
- Instant Hint Tooltip
- Invoice detail sheet
- Keyboard Context Menu
- Keyboard Dropdown Menu
- Layered Context Menu
- Link preview card
- Link Preview Card
- Linked Profile Preview
- Perspective reveal dialog
- Pop scale panel
- Radial action wheel
- Resizing hint tooltip
- Right click context menu
- Scrollable modal dialog
- Shared layout card expand
- Shared-Element Lightbox
- Sheet drawer
- Slide up panel dialog
- Sliding highlight menu
- Staggered Offer Drawer
- Swipe action row
- Swipe Reveal Actions
- Thumbnail-to-video lightbox
- Tilt-in content frame
- Toolbar icon tooltip
- Traveling Toolbar Tooltip
- Typed confirm dialog
- Underline hint tooltip
Pages
- Account signup
- Analytics console page
- Centered signup card
- Detailed signup card
- Editorial review workspace
- Image panel login card
- Image panel signup card
- Minimal email login
- Minimal email sign in
- Muted compact signup
- Muted social login
- Organization settings page
- Product launch page
- Release readiness workspace
- Sign-in card with photo
- Signup card on tint
- Signup card with photo
- Signup page with social
- Simple centered login
- Simple sign-in card
- Social sign-in card
- Split cover login
- Split cover signup
- Split sign-in page
- Usage billing workspace
Scroll
Text effects
- Ascii Art Heading
- Aurora glow heading
- Binary Decode Text
- Blur in word reveal
- Cascading Letter Reveal
- Character shuffle reveal
- Cipher reveal text
- Circular hover speed ring
- Color Band Text Reveal
- Comic pop text
- Count Up Number
- Cube flip letters
- Curved Text Loop
- Elastic weight headline
- Extruded layer text
- Flip panel headline reveal
- Flowing gradient headline
- Flowing gradient text
- Fuzzy static text
- Glare Pass Text
- Gradient shift text
- Gradient sweep heading
- Greeting Cycle
- Hand-drawn text marker
- Highlight focus swap
- Hover Decrypt Text
- Hover speed text ring
- Hover weight ripple text
- Human Typing Rhythm
- Keystroke Text
- Layered shadow headline
- Letter roll in
- Letterpress proof card
- Line by line headline reveal
- Liquid warp headline
- Looping text ribbon
- Looping typewriter text
- Marker highlight
- Media masked heading
- Moire decoder headline
- Morphing Headline
- Outline draw text
- Paper fold text
- Particle formation text
- Physics drop text
- Pointer reactive ASCII text
- Pointer scatter headline
- Pointer scramble text
- Proximity variable type
- Reading highlight copy
- RGB glitch heading
- Rotating badge text
- Rotating Word Swap
- Scramble text
- Scroll blur reveal text
- Scroll float reveal
- Scroll focus reveal
- Scroll Progress Text Reveal
- Scrolling content strip
- Shimmer sweep text
- Shimmer Wave Text
- Signal jitter heading
- Single line typewriter caret
- Sparkling highlight text
- Spinning text ring
- Split flap display
- Split Reveal Hover Text
- Split text entrance
- Split text reveal
- Stacked shadow text
- Staggered Reveal Text
- Staggered text entrance
- Striped shadow heading
- Sweeping shine text
- Sweeping status text
- Trailing echo text
- Twinkle highlight text
- Typewriter caption
- Typewriter sentence cycle
- Typing cursor text
- Velocity marquee text
- Vertical word swap
- Video Fill Text
- Video fill text mask
- Wavy letter heading
- Word Crossfade Blend
- Word morph blend
- Word swap loop
- Word Swap Rotator