Borders
Style
| Name | Value |
|---|---|
| border-style-base | solid |
Width
| Name | Value |
|---|---|
| border-width-thin | 1px |
| border-width-thick | 2px |
Color
Base
| Name | Value |
|---|---|
| border-color-default | #a2a9b1 |
| border-color-binary | #72777d |
| border-color-subtle | #c8ccd1 |
| border-color-hover | #72777d |
| border-color-focus | #a2a9b1 |
| border-color-transparent | transparent |
| border-color-disabled | #c8ccd1 |
Progressive
| Name | Value |
|---|---|
| border-color-default | #36c |
| border-color-hover | #447ff5 |
| border-color-quiet-hover | #eaf3ff |
| border-color-active | #2a4b8d |
| border-color-focus | #36c |
Neutral
| Name | Value |
|---|---|
| border-color-default | #a2a9b1 |
| border-color-hover | #a2a9b1 |
| border-color-quiet-hover | #f8f9fa |
| border-color-active | #72777d |
| border-color-focus | #a2a9b1 |
Destructive
| Name | Value |
|---|---|
| border-color-default | #d33 |
| border-color-hover | #ff4242 |
| border-color-quiet-hover | #fee7e6 |
| border-color-active | #b32424 |
| border-color-focus | #d33 |
Feedback
| Name | Value |
|---|---|
| border-color-notice | #c8ccd1 |
| border-color-error | #d33 |
| border-color-warning | #fc3 |
| border-color-success | #00af89 |