Import

import-button.ts
import { NuiButton } from '@needless-ui/angular/button';

NuiButton

Styles a native <button> or <a> as a button.

Selector
button[nuiButton], a[nuiButton]
Exported as
nuiButton
NuiButton: Properties
NameTypeDefaultDescription
variantInput'solid' | 'soft' | 'outline' | 'ghost''solid'Fill style: solid, soft, outline or ghost.
toneInput'accent' | 'neutral' | 'danger''accent'Color palette: accent, neutral or danger.
sizeInput'sm' | 'md' | 'lg''md'Height, padding and font size: sm, md or lg.
disabledInputbooleanfalseDisables the button. On anchors it sets aria-disabled and blocks activation.
motionInputNuiMotionThe spring it moves with: snappy, bouncy, jelly, elastic, lazy, mechanical or none.
springInputNuiSpringAny spring, as { stiffness, damping, mass }, compiled to CSS at runtime. It overrides motion.
pressInputNuiPressWhat it does while held down: sink, squish, pop, wobble, rubber, tilt or none.
cornersInputNuiCornersThe shape of its corners: round, squircle, bevel, scoop, notch or square.
radiusInputNuiRadiusHow big its corners are: none, small, medium, large or full.
densityInputNuiDensityHow much room it takes: compact, regular or roomy.

Customization inputs you leave unset follow the nearest data-nui-* attribute. See the customization guide.