LUCI Design System
These Kitchen Sink pages are test pages created in order to preview components without any possible documentation site style collisions.
Switches Sink
Example on white background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled
Example on light background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled
Example on dark background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled
Example on light-blue background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled
Example on lightest-blue background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled
Example on medium-blue background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled
Example on dark-blue background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled
Example on darkest-blue background
Default
Disabled
Enabled
Disabled
Enabled
Default hover
Disabled
Enabled
Disabled
Enabled
Default focus
Disabled
Enabled
Disabled
Enabled
Default disabled
Disabled
Enabled
Disabled
Enabled
Default Inline
Disabled
Enabled
Disabled
Enabled
Default label on left
Disabled
Enabled
Default static label
Switch Static Label
Default no label
Disabled
Enabled
Default hover no label
Disabled
Enabled
Disabled
Enabled
Default focus no label
Disabled
Enabled
Disabled
Enabled
Default disabled no label
Disabled
Enabled
Disabled
Enabled
Default no label inline
Disabled
Enabled
Group
Disabled
Enabled
Disabled
Enabled
Compressed
Disabled
Enabled
Disabled
Enabled
Compressed hover
Disabled
Enabled
Disabled
Enabled
Compressed focus
Disabled
Enabled
Disabled
Enabled
Compressed disabled
Disabled
Enabled
Disabled
Enabled
Compressed Inline
Disabled
Enabled
Disabled
Enabled
Compressed label on left
Disabled
Enabled
Compressed static label
Switch Static Label
Compressed no label
Disabled
Enabled
Disabled
Enabled
Compressed hover no label
Disabled
Enabled
Disabled
Enabled
Compressed focus no label
Disabled
Enabled
Disabled
Enabled
Compressed disabled no label
Disabled
Enabled
Disabled
Enabled
Compressed no label inline
Disabled
Enabled
Disabled
Enabled