Examples
Techniques for styling and animating React Aria Components, and integrating with other libraries.
![](/action-menu.a40d475b.png)
Action Menu
An animated menu of actions, styled with Tailwind CSS.
![](/category-tabs.d8b39566.png)
Category Tabs
An article category tabs component styled with Tailwind CSS.
![](/contact-list.f55ca072.png)
Contact List
A ListBox featuring sticky section headers and multiple selection.
![](/datepicker.87616a89.png)
DatePicker
A DatePicker component styled with Tailwind CSS.
![](/destructive-dialog.f5e0bfc9.png)
Destructive Alert Dialog
An animated confirmation dialog, styled with Tailwind CSS.
![](/framer-modal-sheet.36ef0b58.png)
Gesture Driven Modal Sheet
An iOS-style gesture driven modal sheet built with Framer Motion.
![](/image-grid.ed7537c5.png)
Image Grid
An async image gallery with selectable items, styled with Tailwind CSS.
![](/ios-list.f0af1f26.png)
iOS List View
A GridList with swipe gestures, layout animations, and multi selection.
![](/loading-progress.8e0f4e28.png)
Loading ProgressBar
A loading ProgressBar styled with Tailwind CSS.
![](/notifications-popover.bc4aacbd.png)
Notifications Popover
A notifications popover styled with Tailwind CSS.
![](/opacity-slider.380b7298.png)
Opacity Slider
An opacity slider styled with Tailwind CSS.
![](/ripple-button.98c9c37c.png)
Ripple Button
A button with an animated ripple effect styled with Tailwind CSS.
![](/shipping-radio.7c3f88e7.png)
Shipping Radio Group
A shipping options RadioGroup styled with Tailwind CSS.
![](/status-select.10cabd7e.png)
Status Select
An issue status dropdown styled with Tailwind CSS.
![](/stock-table.4400004a.png)
Stock Table
A table with sticky headers, sorting, multiple selection, and column resizing.
![](/swipeable-tabs.1bdb88b4.png)
Swipeable Tabs
A swipeable Tabs component built with Framer Motion and CSS scroll snapping.
![](/user-combobox.e18ab045.png)
User Search ComboBox
A user search ComboBox styled with Tailwind CSS.
![](/wifi-switch.025c1714.png)
Wi-Fi Switch
An animated Wi-Fi Switch styled with Tailwind CSS.