Icon cards
Small Icon cards
Primary
Secondary
Title
Lorem ipsum dolor sit amet consectetur.
Title
Lorem ipsum dolor sit amet consectetur.
medium Icon cards
Primary
Secondary
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
Horizontal cards
Small horizontal cards
White theme
Primary
Secondary
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
Blue theme
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
Medium horizontal cards
White theme
Secondary
Blue theme
Vertical cards
Medium vertical cards
White theme
Primary
Blue theme
Title
Subtitle
Supplemental
With UI control and supplemental action.
I’m a White Themed Vertical card in Medium size. My action type is Supplemental, and I have a Supplemental type action and a UI control with one action and two decorative element. Please customize me based on the latest design system version, because I should never look like this.
BUTTON
Title
Subtitle
Primary
With UI control and supplemental action.
I’m a Vertical card in Medium size. My action type is Primary, and I have a Supplemental type action and a UI control with three decorative element, one of which has an icon. Please customize me based on the latest design system version, because I should never look like this.
Title
Subtitle
Supplemental
With UI control and supplemental action.
I’m a Blue Themed Vertical card in Medium size. My action type is Supplemental, and I have a Supplemental type action and a UI control with one action and two decorative element. Please customize me based on the latest design system version, because I should never look like this.
BUTTON
Fullscreen cards
White theme
Title
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
Blue theme
Title
Title
Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod. Lorem ipsum dolor sit amet consectetur. Lobortis eget euismod.
