Layout & Containers
Simple header
App Layout Options
Containers
Variant main color
Icon color
Basic
<UIContainersBasic icon-color='red'/>
Variant Container
Container with default styling. only the icon color is can be changed.
Basic Container Content
Just title
Just title
Minimal
Variant
<UIContainersVariants color='primary' icon-color='red'/>
Variant Container
Container with variant background and border.
Variant Container Content
Another Variant
Just title
Minimal
Collapsibles & Accordions
Interactive containers for toggling the visibility of content.
Generic Collapsable
Simple Title Example
Custom Trigger with Sticky Header
Complex Expandable Card
Outer Top Slot Content
User
John DoeDetails
Card Designs
Base Container Card
Standard background and border utility class.
Frames & Panels
plaintext
Content inside frame
Panel Header
Left Sidebar
Main Content Area
Right Sidebar
Status: Ready
Generator Page Layout
The standard wrapper for tool pages. Shown here inside a container to prevent full-screen expansion.
Demo Generator
This is how the generator layout looks.
Generator
Main Configuration
Additional settings form content goes here...
Actions
// Generated code preview appears here
config_variable="true";
run_demo();
config_variable="true";
run_demo();
Headers
Tabs
Content 1