Button
Common buttons prompt most actions in a UI
- Can contain an optional leading icon
- Four types: sharp, rounded, outlined, and ghost
- Keep labels concise and in sentence-case
- Containers are either sharp or rounded and wide enough to fit label text
Example
1
2
3
4
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |
- Can contain an optional leading icon
- Four types: sharp, rounded, outlined, and ghost
- Keep labels concise and in sentence-case
- Containers are either sharp or rounded and wide enough to fit label text
Example
1
2
3
4
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |
- Can contain an optional leading icon
- Four types: sharp, rounded, outlined, and ghost
- Keep labels concise and in sentence-case
- Containers are either sharp or rounded and wide enough to fit label text
Example
1
2
3
4
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |
- Can contain an optional leading icon
- Four types: sharp, rounded, outlined, and ghost
- Keep labels concise and in sentence-case
- Containers are either sharp or rounded and wide enough to fit label text
Example
1
2
3
4
Resources
| Name | Resource | Status |
|---|---|---|
| Figma | Design Kit (Figma) | Private |