Develop ultra fast with Prismane 🎉

Button API

Learn about the Button component's props and CSS classes.


import { ButtonProps } from "@prismane/core";


Button extends Transition component's props.

iconReactNodeThe icon of the button.-
typesubmit / reset / buttonThe type of the button.-
loadingbooleanTriggers the button's loading state.-
disabledbooleanTriggers the button's disabled state.-
variantprimary / secondary / tertiary / textChanges the variant of the button.primary
colorPrismaneColors Changes the color of the button.primary
sizePrismaneBreakpoints Changes the size of the button.base
fullbooleanTriggers the button spreading to the full size of the container.-
shadowbooleanTriggers the button's shadow.-
fillOnHoverbooleanTriggers the button filling it's background on hover.-


Button extends Transition component's CSS classes.

RuleGlobal ClassDescription
root.PrismaneButton-rootThe wrapper box of the button.
root.PrismaneButton-root-{variant}The wrapper box of the button based on the variant.
root.PrismaneButton-root-{size}The wrapper box of the button based on the size.
root.PrismaneButton-root-{color}The wrapper box of the button based on the color.
icon.PrismaneButton-iconThe icon wrapper box of the button.
text.PrismaneButton-textThe text wrapper box of the button.