Internet lost. Attempting reconnection...
404
Page Not Found
Go Home
Search
Results
Pro
Membership
Pro
Releases
Pro
Roadmap
Pro
Pro Docs
Install
New project
Install
How to install Tailwind
Install
How to install Petal Components
Install
How to install VSCode snippets
Install
Namespacing
Petal Framework
Installation
Petal Framework
Deployment
Petal Framework
Authenticating for CI
Petal Framework
Changelog
Aurora
Basic Aurora
Aurora
Custom Colors
Aurora
Aurora with Content
Aurora
Aurora Card
Aurora
Testimonial with Aurora
Aurora
Properties
Accordion
Ghost Accordion
Accordion
Basic Accordion
Accordion
Dynamic Accordion
Accordion
Properties
Alerts
Default
Alerts
With icon
Alerts
Dismissable
Alerts
With optional heading
Alerts
Properties
Avatars
Image avatars
Avatars
Avatars with placeholder icon
Avatars
Avatars with placeholder initials
Avatars
Colored avatars with placeholder initials
Avatars
Avatar groups stacked
Avatars
Properties
Badges
Light
Badges
Dark
Badges
Soft
Badges
Outline
Badges
With icon
Badges
Properties
Border Beam
Basic BorderBeam
Border Beam
Custom Colors
Border Beam
BorderBeam with Content
Border Beam
Pricing Cards
Border Beam
Feature Highlight
Border Beam
Newsletter with BorderBeam
Border Beam
Properties
Breadcrumbs
Slash
Breadcrumbs
Chevron
Breadcrumbs
With icon
Breadcrumbs
Properties
Buttons
Types
Buttons
Colors
Buttons
Outline
Buttons
Inverted
Buttons
Shadow
Buttons
Ghost
Buttons
Radius
Buttons
Sizes
Buttons
States
Buttons
With icon
Buttons
Icon buttons
Buttons
Properties
Button Group
Buttons
Button Group
Links
Button Group
Properties
Card
Basic cards
Card
Outline cards
Card
Cards with media
Card
Cards with media and footer
Card
Card with review
Card
Properties
Color scheme switch
Color scheme switch
Color scheme switch
Installation
Combo-box
Installation
Combo-box
Properties
Combo-box
Single select
Combo-box
Multiple select
Combo-box
Remote options search
Combo-box
Create new option
Combo-box
Disabled
Combo-box
Max items
Combo-box
Placeholder
Combo-box
Option groups
Combo-box
Plugins
Combo-box
Custom Tom Select options
Combo-box
Customization
Containers
Sizes
Containers
Properties
Content Editor
Example Form
Content Editor
Content Field Properties
Content Editor
Rendering Content
Content Editor
Rendering Content with Tailwind Prose
Data Table
Basic data table
Data Table
Defaults
Data Table
Filtering
Dropdowns
Basic dropdown
Dropdowns
Unlabelled dropdown
Dropdowns
Basic dropdown
Dropdowns
Custom dropdown trigger
Dropdowns
Properties
Forms
All fields example
Forms
Field
Forms
Field Properties
Forms
Clearable
Forms
Copyable
Forms
Viewable
Forms
Checkbox
Forms
Checkbox group
Forms
Color input
Forms
Date input
Forms
Datetime local input
Forms
Email input
Forms
File input
Forms
Hidden input
Forms
Number input
Forms
Password input
Forms
Radio group
Forms
Radio card
Forms
Range input
Forms
Search input
Forms
Select
Forms
Switch
Forms
Telephone input
Forms
Text input
Forms
Textarea
Forms
Time input
Forms
URL input
Forms
Field label
Forms
Field error
Forms (v1)
Form field
Forms (v1)
Text input
Forms (v1)
Email input
Forms (v1)
Number input
Forms (v1)
Password input
Forms (v1)
Search input
Forms (v1)
Telephone input
Forms (v1)
URL input
Forms (v1)
Hidden input
Forms (v1)
Time input
Forms (v1)
Time select
Forms (v1)
Date input
Forms (v1)
Date select
Forms (v1)
Datetime local input
Forms (v1)
Datetime select
Forms (v1)
Color input
Forms (v1)
File input
Forms (v1)
Range input
Forms (v1)
Textarea
Forms (v1)
Select
Forms (v1)
Multiple Select
Forms (v1)
Switch
Forms (v1)
Checkbox
Forms (v1)
Checkbox group
Forms (v1)
Radio
Forms (v1)
Labels
Forms (v1)
Errors
Forms (v1)
Help text
Components
Flash
Components
Floating div
Generators
petal.gen.live
Generators
petal.gen.html
Generators
Compatibility
Heroicons
Heroicons
Heroicons
Properties
Heroicons
Heroicon name checking
Heroicons
Setup
Heroicons
Why use CSS?
Heroicons
Compatability
Heroicons (old)
Heroicons
Heroicons (old)
Icon (v2)
Heroicons (old)
Solid (v1)
Heroicons (old)
Outline (v1)
Layouts
Sidebar layout
Layouts
Upgrading to the collapsible sidebar
Layouts
Sidebar layout properties
Layouts
Stacked layout
Layouts
Stacked layout properties
Layouts
Install a layout
Layouts
Menu item structure
Layouts
Signed in users
Layouts
Custom menu items
Language select
Language Select
Language select
Properties
Links
Types
Links
Properties
Local time
Local time
Local time
Properties
Loading
Spinner
Loading
Properties
Marquee
Logo marquee
Marquee
Testimonial marquee
Marquee
Vertical marquee
Marquee
Icon marquee
Marquee
Properties
Menus
Vertical menu
Menus
Vertical menu properties
Modals
Sizes
Modals
Close modal target
Modals
Properties
Rating
Basic rating
Rating
Properties
Pagination
Basic pagination
Pagination
Interactive pagination
Pagination
Properties
Progress
Progress bars
Progress
Sizes
Progress
Properties
Skeleton
Default skeleton
Skeleton
Image skeleton
Skeleton
Video skeleton
Skeleton
Text skeleton
Skeleton
Card skeleton
Skeleton
Widget skeleton
Skeleton
List skeleton
Skeleton
Testimonial skeleton
Skeleton
Properties
Slide Over
Origins
Slide Over
Properties
Stepper
Default stepper
Stepper
Orientation
Stepper
Sizes
Stepper
Properties
Table
Dynamic table
Table
With streams
Table
Basic table
Table
Multi-lined table with avatars and badges
Table
Properties
Tabs
Basic tabs
Tabs
Tabs with underline
Tabs
Basic tabs with number
Tabs
Tabs underlined with number
Tabs
Basic tabs with icons
Tabs
Tabs underlined with outline icons
Tabs
Properties
Tooltip
Tooltip
Typography
Headings
Typography
Paragraphs
Typography
Lists
Typography
Prose
Modifying components
One-off modifications
Modifying components
Global modifications
Modifying components
Backwards compatibility with new custom components
Copy Pro Components
JavaScript Hooks
Copy Pro Components
NPM Packages
Copy Pro Components
Final Steps
Snippets cheatsheet
VSCode Snippets Cheatsheet
Upgrade guide
0.17 - 0.18
Forms
Simple form
OpenAI
Open AI Prompt
Phoenix Flutter counter
Phoenix flutter counter
