Component tokens
Per-component overrides. Use these when you want to retheme a single component class without affecting the rest of the library.
| Token | Value |
|---|---|
--ep-button-radius | {radius.base} |
--ep-button-transition | {transition.base} |
--ep-button-font-family | {font.family.base} |
--ep-button-font-weight | {primitive.font.weight.semibold} |
--ep-button-size-xs-height | 1.5rem |
--ep-button-size-xs-padding-x | {primitive.spacing.2} |
--ep-button-size-xs-font-size | {primitive.font.size.xs} |
--ep-button-size-sm-height | 2rem |
--ep-button-size-sm-padding-x | {primitive.spacing.3} |
--ep-button-size-sm-font-size | {primitive.font.size.sm} |
--ep-button-size-md-height | 2.5rem |
--ep-button-size-md-padding-x | {primitive.spacing.4} |
--ep-button-size-md-font-size | {primitive.font.size.md} |
--ep-button-size-lg-height | 3rem |
--ep-button-size-lg-padding-x | {primitive.spacing.5} |
--ep-button-size-lg-font-size | {primitive.font.size.lg} |
--ep-button-size-xl-height | 3.5rem |
--ep-button-size-xl-padding-x | {primitive.spacing.6} |
--ep-button-size-xl-font-size | {primitive.font.size.xl} |
--ep-input-radius | {radius.base} |
--ep-input-height | 2.5rem |
--ep-input-padding-x | {primitive.spacing.3} |
--ep-input-font-family | {font.family.base} |
--ep-input-font-size | {primitive.font.size.md} |
--ep-input-border-color | {color.divider} |
--ep-tag-radius | {primitive.radius.sm} |
--ep-tag-padding-x | {primitive.spacing.2} |
--ep-tag-padding-y | {primitive.spacing.1} |
--ep-tag-font-size | {primitive.font.size.xs} |
--ep-avatar-radius | {primitive.radius.full} |