Streamline the Laravel SaaS Starter Kit - Launch Your Next SaaS Today

Container

Contain your content on the page

x-t-container
Slug: container

Preview and Examples

default container
brand container
primary container
secondary container
success container
warning container
danger container 
<x-turbine-ui-container>
    default container
</x-turbine-ui-container>
 
<x-turbine-ui-container variant="brand">
    brand container
</x-turbine-ui-container>
 
<x-turbine-ui-container variant="primary">
    primary container
</x-turbine-ui-container>
 
<x-turbine-ui-container variant="secondary">
    secondary container
</x-turbine-ui-container>
 
<x-turbine-ui-container variant="success">
    success container
</x-turbine-ui-container>
 
<x-turbine-ui-container variant="warning">
    warning container
</x-turbine-ui-container>
 
<x-turbine-ui-container variant="danger">
    danger container
</x-turbine-ui-container>

Attributes

Name Type Options Description
accent boolean
true false
Adds an accent
border boolean
true false
Adds a border
gradient boolean
true false
Adds a gradient
grid string
1 2 3 4 5 6 12
Splits content into columns
hollow boolean
true false
Removes background colour
ring boolean
true false
Adds a ring
rounded boolean
true false
Adds rounded corners
shadow boolean
true false
Adds a shadow
size string
xs sm md lg xl 2xl
Controls component scale
variant string
default brand primary secondary success warning danger light dark
A variant is like a colour palette