Skeleton utilizes the power of Tailwind to provide a universal system for customizing spacing throughout your application. While enabling this customization per each theme.
--spacing: 0.25rem80
72
64
60
56
52
48
44
40
36
32
28
24
20
16
14
12
11
10
9
8
7
6
5
4
3.5
3
2.5
2
1.5
1
0.5
How It Works
In recent versions of Skeleton, this is implemented using the official Tailwind Spacing property.
@layer theme {
:root {
--spacing: 0.25rem;
}
}
However, this can be customized to each Skeleton theme.
[data-theme='cerberus'] {
--spacing: 0.25rem;
}
[data-theme='mona'] {
--spacing: 0.2rem;
}
Supported Properties
The scaling system supports all relevant Tailwind utility classes, including, but not limited to:
padding, margin, width, minWidth, maxWidth, height, minHeight, maxHeight, gap, inset, space, translate
Core API
For more information on theme properties, please refer to the Core API documentation.