@salesforce-ux/design-system/metadata/components/buttons/styling-hooks.json

Salesforce Lightning Design System

{"--slds-c-button-stateful-color-background-selected":{"fallbackValue":"transparent","category":"Color","valueType":"Color"},"--slds-c-button-stateful-color-border-selected":{"fallbackValue":"transparent","category":"Color","valueType":"Color"},"--slds-c-button-stateful-color-background-selected-hover":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-stateful-color-border-selected-hover":{"fallbackValue":"1, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-stateful-color-background-selected-active":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-spacing-inline-start":{"fallbackValue":"0","category":"Spacing","valueType":"Dimension"},"--slds-c-button-text-color-hover":{"fallbackValue":"rgb(1, 68, 134)","category":"Color","valueType":"Color"},"--slds-c-button-brand-color-background":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-brand-spacing-inline-start":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-brand-spacing-inline-end":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-brand-color-border":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-brand-text-color":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-brand-color-background-hover":{"fallbackValue":"rgb(1, 68, 134)","category":"Color","valueType":"Color"},"--slds-c-button-brand-color-border-hover":{"fallbackValue":"rgb(1, 68, 134)","category":"Color","valueType":"Color"},"--slds-c-button-brand-text-color-hover":{"fallbackValue":"rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-spacing-block-start":{"fallbackValue":"0","category":"Spacing","valueType":"Dimension"},"--slds-c-button-spacing-inline-end":{"fallbackValue":"0","category":"Spacing","valueType":"Dimension"},"--slds-c-button-spacing-block-end":{"fallbackValue":"0","category":"Spacing","valueType":"Dimension"},"--slds-c-button-color-background":{"fallbackValue":"transparent","category":"Color","valueType":"Color"},"--slds-c-button-color-border":{"fallbackValue":"transparent","category":"Color","valueType":"Color"},"--slds-c-button-sizing-border":{"fallbackValue":"1px","category":"Sizing","valueType":"Dimension"},"--slds-c-button-radius-border":{"fallbackValue":"0.25rem","category":"Radius","valueType":"Dimension"},"--slds-c-button-shadow":{"fallbackValue":"","category":"Box Shadow","valueType":"String"},"--slds-c-button-line-height":{"fallbackValue":"1.875rem","category":"Text","valueType":"Number"},"--slds-c-button-text-color":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-color-border-hover":{"fallbackValue":"","category":"Color","valueType":"Color"},"--slds-c-button-color-background-hover":{"fallbackValue":"","category":"Color","valueType":"Color"},"--slds-c-button-shadow-focus":{"fallbackValue":"1","category":"Box Shadow","valueType":"String"},"--slds-c-button-text-color-active":{"fallbackValue":"rgb(1, 68, 134)","category":"Color","valueType":"Color"},"--slds-c-button-color-background-active":{"fallbackValue":"","category":"Color","valueType":"Color"},"--slds-c-button-color-border-active":{"fallbackValue":"","category":"Color","valueType":"Color"},"--slds-c-button-destructive-text-color":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-text-color-hover":{"fallbackValue":"30, rgb(186, 5, 23)","category":"Color","valueType":"Color"},"--slds-c-button-success-text-color-hover":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-shadow-focus":{"fallbackValue":"0 0 3px #f3f3f3","category":"Box Shadow","valueType":"String"},"--slds-c-button-neutral-spacing-inline-start":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-neutral-spacing-inline-end":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-neutral-color-background":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-neutral-color-border":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-neutral-color-background-hover":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-neutral-color-border-hover":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-neutral-color-background-active":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-neutral-color-border-active":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-brand-color-background-active":{"fallbackValue":"rgb(1, 68, 134)","category":"Color","valueType":"Color"},"--slds-c-button-brand-color-border-active":{"fallbackValue":"rgb(1, 68, 134)","category":"Color","valueType":"Color"},"--slds-c-button-brand-text-color-active":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-outline-brand-spacing-inline-start":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-outline-brand-spacing-inline-end":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-outline-brand-color-background":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-outline-brand-color-border":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-outline-brand-color-background-hover":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-outline-brand-color-border-hover":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-outline-brand-color-background-active":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-outline-brand-color-border-active":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-spacing-inline-start":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-inverse-spacing-inline-end":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-inverse-color-background":{"fallbackValue":"transparent","category":"Color","valueType":"Color"},"--slds-c-button-inverse-color-border":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-color-background-hover":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-color-border-hover":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-color-background-active":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-color-border-active":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-text-color":{"fallbackValue":"100, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-text-color-hover":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-inverse-text-color-active":{"fallbackValue":"rgb(1, 118, 211)","category":"Color","valueType":"Color"},"--slds-c-button-destructive-spacing-inline-start":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-destructive-spacing-inline-end":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-destructive-color-background":{"fallbackValue":"40, rgb(186, 5, 23)","category":"Color","valueType":"Color"},"--slds-c-button-destructive-color-border":{"fallbackValue":"40, rgb(186, 5, 23)","category":"Color","valueType":"Color"},"--slds-c-button-destructive-color-background-hover":{"fallbackValue":"30, rgb(142, 3, 15)","category":"Color","valueType":"Color"},"--slds-c-button-destructive-color-border-hover":{"fallbackValue":"","category":"Color","valueType":"Color"},"--slds-c-button-destructive-text-color-hover":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-destructive-color-background-active":{"fallbackValue":"30, rgb(142, 3, 15)","category":"Color","valueType":"Color"},"--slds-c-button-destructive-color-border-active":{"fallbackValue":"30, rgb(142, 3, 15)","category":"Color","valueType":"Color"},"--slds-c-button-destructive-text-color-active":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-spacing-inline-start":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-text-destructive-spacing-inline-end":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-text-destructive-color-background":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-color-border":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-text-color":{"fallbackValue":"30, rgb(234, 0, 30)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-color-background-hover":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-color-border-hover":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-color-background-active":{"fallbackValue":"95, rgb(243, 243, 243)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-color-border-active":{"fallbackValue":"4, rgb(201, 201, 201)","category":"Color","valueType":"Color"},"--slds-c-button-text-destructive-text-color-active":{"fallbackValue":"30, rgb(186, 5, 23)","category":"Color","valueType":"Color"},"--slds-c-button-success-spacing-inline-start":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-success-spacing-inline-end":{"fallbackValue":"1rem","category":"Spacing","valueType":"Dimension"},"--slds-c-button-success-color-background":{"fallbackValue":"70, rgb(69, 198, 90)","category":"Color","valueType":"Color"},"--slds-c-button-success-color-border":{"fallbackValue":"50, rgb(145, 219, 139)","category":"Color","valueType":"Color"},"--slds-c-button-success-text-color":{"fallbackValue":"10, rgb(24, 24, 24)","category":"Color","valueType":"Color"},"--slds-c-button-success-color-background-hover":{"fallbackValue":"50, rgb(46, 132, 74)","category":"Color","valueType":"Color"},"--slds-c-button-success-color-border-hover":{"fallbackValue":"50, rgb(46, 132, 74)","category":"Color","valueType":"Color"},"--slds-c-button-success-color-background-active":{"fallbackValue":"50, rgb(46, 132, 74)","category":"Color","valueType":"Color"},"--slds-c-button-success-color-border-active":{"fallbackValue":"50, rgb(46, 132, 74)","category":"Color","valueType":"Color"},"--slds-c-button-success-text-color-active":{"fallbackValue":"100, rgb(255, 255, 255)","category":"Color","valueType":"Color"},"--slds-c-icon-color-foreground":{"fallbackValue":"currentColor","category":"Color","valueType":"Color"}}