Polaris ViewComponents
Previews
Collapse all
Action List
Default
With Icons
With Icon And Suffix
Sectioned
With Destructive Item
With Help Text
With Prefix And Suffix
Autocomplete
Basic
With Prefix Or Suffix
Multiselect
Preselected
Remote
Multiple Sections
Empty State
Event Handler
Long Page
Avatar
Default
Basic
Extra Small
Square
Initials
Image
Icon
Badge
Default
Informational
Success
Attention
Warning
Critical
Incomplete
Partially Complete
Complete
Banner
Default
Dismissible
With Actions
Informational
Success
Warning
Critical
Within Card
Within Card With Title
Only Title
Bleed
Horizontal
Vertical
Special Direction
Box
Color
Border Width
Border Radius
Padding
Shadow
Button
Basic
Outline
Outline Monochrome
Plain
Plain Monochrome
Plain Monochrome No Underline
Plain Destructive
Primary
Primary Destructive
Destructive
Slim
Large
Full Width
Text Aligned
Pressed
Disclosure
Disabled
Disable With Actions
Disable With Loader
Loading
Text With Icon
Icon Only
With Icon Name
External
Button Group
Default
Segmented
Outline Segmented
Connected Tops
Full Width
With Text Item
With Plain Item
Nowrap
Callout Card
Default
With Secondary Action
Dismissible
Caption
Card
Default
Card With Header Actions
Card With Footer Actions
Card With Custom Footer Actions
Card With Destructive Footer Action
Card With Multiple Sections
Card With Multiple Titled Sections
Card Section With Action
Card With Subsection
Card Section With Destructive Action
Card With Subdued Section
Subdued Card For Secondary Content
Card With Separate Header
Card With All Of Its Elements
Card With Flushed Sections
Unsectioned Content
Unstyled Section
Section With Borders
Without Title
Borderless
Checkbox
Default
With Help Text
With Error
Indeterminate
Choice List
Single Choice
Single Choice With Error
Multi Choice
With Children Content Always Rendered
Collapsible
Contextual Save Bar
Default
Full Width
With Flush Content
Data Table
Default
Sortable
With Footer
With Totals In Footer
With Row Links
Increased Density
Description List
Default
Tight Spacing
Display Text
Extra Large
Large
Medium
Small
Divider
Dropzone
With File Upload
With A Label
With Image Upload
With Single File Upload
With Drop On Page
Accepts Only Svg Files
With Custom File Dialog Trigger
With Custom File Button
Without Preview
Medium Sized
Small Sized
Empty Search Results
Empty State
Default
With Subdued Footer
Full Width
Unsectioned Content
Exception List
Filters
With Resource List
With Data Table
With Custom Content
Disabled
With Help Text
Without Query
With Tags
Footer Help
Form Builder
Text Field
Select
Check Box
Radio Button
Collection Check Boxes
Errors
Dropzone
Autocomplete
Form Layout
Default
Field Group
Condensed Group
Frame
Default
Optional Detail
Show Avatar First
With Secondary Menu
Heading
Default
Paragraph
Horizontal Grid
Gap
Column Width
Number Of Columns
Horizontal Stack
Non Wrapping
Gap
Block Align
Icon
Default
Colored
With Backdrop
With Custom Svg
With Custom Svg And Color
Index Table
Inline
Default
Non Wrapping
Gap
Vertical Alignment
Horizontal Alignment
Inline Error
Keyboard Key
Layout
One Column Layout
Two Columns With Primary And Secondary Widths
Two Columns With Equal Width
Three Columns With Equal Width
Four Columns With Equal Width
Annotated Layout
Annotated Layout With Sections
Annotated Layout With Banner At The Top
Mixed Layout
Link
Default
Monochrome
Monochrome In Banner
External
No Underline
List
Bulleted
Numbered
Extra Tight
Modal
Basic
Large
Small
Custom Close Button
Multiple Sections
With Primary Action
With Destructive Primary Action
Without Title
Navigation
Default
Multiple Sections
Sub Items
With Active Items
With Disabled Items
With External Items
With Secondary Action
With Section Separator
Navigation List
Option List
Single Choice
Multi Choice
Custom Content
With Sections
In Popover
Page
Default
With All Header Elements
Without Primary Action
With Destructive Secondary Action
With Subtitle
With External Link
Full Width
Narrow Width
With Action Group
Without Header
With Title Metadata
With Divider
With Custom Action
Page Actions
Default
Primary Only
Pagination
Default
With Label
Popover
With Action List
With Content And Actions
With Form
With Custom Activator
Appended To Body
Progress Bar
Default
Small Progress Bar
Colored Progress Bars
Non Animated Progress Bar
Radio Button
Default
With Help Text
Resource Item
Default
With Link
With Checkbox
With Radio
With Media
With Vertical Alignment
With Selected
Resource List
Simple List
With Total Resource Count
With Shortcut Actions
With Persistent Shortcut Actions
Scrollable
Default
With Shadows
Select
Default
Grouped
Time Zone
Inline Label
Label Action
Required
Disabled
With Help Text
With Error
With Inline Error
Setting Toggle
Shopify Navigation
Default
With Auto Detection
Skeleton Body Text
Default
Single Line
Skeleton Display Text
Small
Medium
Large
Extra Large
Skeleton Page
Dynamic Content
Static Content
Skeleton Thumbnail
Medium
Large
Small
Spacer
Vertical
Horizontal
Spinner
Default
Small
Stack
Default
Non Wraping
Loose Spacing
Vertically Centered
Fill Space Proportionally
Fill Space Evenly
Fill Remaining Space
Subheading
Default
Paragraph
Tabs
Default
Fitted
With Badge
Tag
Default
Disabled
With Remove Button
Clickable
Text
Default
Body
Align
Weight
Color
Text Container
Default
Tight Text
Loose Text
Text Field
Default
Number
Email
Multiline
With Hidden Label
With Label Action
With Right Aligned Text
With Placeholder Text
With Help Text
With Prefix Or Suffix
With Connected Fields
With Error
With Inline Error
Clear Error On Focus
Disabled
Readonly
With Character Count
With Clear Button
With Monospaced Font
Text Style
Subdued
Strong
Positive
Negative
Code
Shortcuts
Small
Thumbnail
Default
Small
Large
With Icon
Toast
Basic
Multiple
Custom Duration
With Action
Error
Long Page
Multiline
Tooltip
Default
Inside Paragraph
Long Page
Url Helpers
Button
Link
Mail Link
Vertical Stack
Gap
Align
Inline Align
Visually Hidden
No matching results.
Polaris ViewComponents
Select a preview from the nav to get started.