Creates a box-shadow property with a single shadow. The property accepts either the BoxShadow.None value, the default global keywords, which indicates no shadows, or a list of shadows, created by using BoxShadow.of, ordered front to back.

fun Modifier.boxShadow(vararg boxShadows: BoxShadow.Repeatable): Modifier

The box-shadow property attaches one or more drop shadows to the box. The property accepts either the BoxShadow.None value, which indicates no shadows, or a list of shadows, created by using BoxShadow.of, ordered front to back.

fun Modifier.boxShadow(offsetX: CSSLengthNumericValue = 0.px, offsetY: CSSLengthNumericValue = 0.px, blurRadius: CSSLengthNumericValue? = null, spreadRadius: CSSLengthNumericValue? = null, color: CSSColorValue? = null, inset: Boolean = false): Modifier

Creates a single shadowed box-shadow to the desired element.

boxSizing

fun Modifier.boxSizing(boxSizing: BoxSizing): Modifier

captionSide

fun Modifier.captionSide(captionSide: CaptionSide): Modifier

caretColor

fun Modifier.caretColor(caretColor: CaretColor): Modifier

fun Modifier.caretColor(color: CSSColorValue): Modifier

classNames

fun Modifier.classNames(vararg classes: String): Modifier

clear

fun Modifier.clear(clear: Clear): Modifier

color

fun Modifier.color(color: CSSColor): Modifier

fun Modifier.color(color: CSSColorValue): Modifier

colorScheme

fun Modifier.colorScheme(colorScheme: ColorScheme): Modifier

columnClasses

fun Modifier.columnClasses(verticalArrangement: Arrangement.Vertical = ColumnDefaults.VerticalArrangement, horizontalAlignment: Alignment.Horizontal = ColumnDefaults.HorizontalAlignment): Modifier

Add classes that tell the browser to display this element as a column.

columnGap

fun Modifier.columnGap(value: CSSLengthOrPercentageNumericValue): Modifier

columnRule

fun Modifier.columnRule(scope: ColumnRuleScope.() -> Unit): Modifier

fun Modifier.columnRule(width: CSSLengthNumericValue? = null, style: LineStyle? = null, color: CSSColorValue? = null): Modifier

content

fun Modifier.content(content: Content.Restricted): Modifier

fun Modifier.content(vararg contents: Content.Unrestricted): Modifier

fun Modifier.content(value: String): Modifier

fun Modifier.content(altText: String, vararg contents: Content.Unrestricted): Modifier

contentEditable

fun Modifier.contentEditable(editable: Boolean): Modifier

cursor

fun Modifier.cursor(cursor: Cursor): Modifier

dataAttr

fun Modifier.dataAttr(name: String, value: String): Modifier

Define a single HTML data attribute.

dataAttrs

fun Modifier.dataAttrs(vararg nameValues: Pair<String, String>): Modifier

Declare one or more HTML data attributes

dir

fun Modifier.dir(dirType: DirType): Modifier

disabled

fun Modifier.disabled(value: Boolean = true): Modifier

display

fun Modifier.display(value: DisplayStyle): Modifier

draggable

fun Modifier.draggable(draggable: Boolean): Modifier

fun Modifier.draggable(draggable: Draggable): Modifier

fillMaxHeight

fun Modifier.fillMaxHeight(percent: CSSPercentageNumericValue = 100.percent): Modifier

fillMaxSize

fun Modifier.fillMaxSize(percent: CSSPercentageNumericValue = 100.percent): Modifier

fillMaxWidth

fun Modifier.fillMaxWidth(percent: CSSLengthOrPercentageNumericValue = 100.percent): Modifier

filter

fun Modifier.filter(filter: Filter): Modifier

fun Modifier.filter(vararg filters: CSSFilter): Modifier

flex

fun Modifier.flex(value: Int): Modifier

fun Modifier.flex(value: String): Modifier

fun Modifier.flex(value: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.flex(flexGrow: Int, flexShrink: Int): Modifier

fun Modifier.flex(flexGrow: Int, flexBasis: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.flex(flexGrow: Int, flexShrink: Int, flexBasis: CSSLengthOrPercentageNumericValue): Modifier

flexBasis

fun Modifier.flexBasis(flexBasis: FlexBasis): Modifier

fun Modifier.flexBasis(value: CSSLengthOrPercentageNumericValue): Modifier

flexDirection

fun Modifier.flexDirection(flexDirection: FlexDirection): Modifier

flexFlow

fun Modifier.flexFlow(flexDirection: FlexDirection, flexWrap: FlexWrap): Modifier

flexGrow

fun Modifier.flexGrow(value: Number): Modifier

flexShrink

fun Modifier.flexShrink(value: Number): Modifier

flexWrap

fun Modifier.flexWrap(flexWrap: FlexWrap): Modifier

float

fun Modifier.float(float: CSSFloat): Modifier

fold

open override fun <R> fold(initial: R, operation: (R, Modifier.Element) -> R): R

Run through all elements from left to right and apply operation on each one in order.

font

fun Modifier.font(scope: FontScope.() -> Unit): Modifier

fontFamily

fun Modifier.fontFamily(vararg values: String): Modifier

fontOpticalSizing

fun Modifier.fontOpticalSizing(value: FontOpticalSizing): Modifier

fontSize

fun Modifier.fontSize(fontSize: FontSize): Modifier

fun Modifier.fontSize(value: CSSLengthOrPercentageNumericValue): Modifier

fontStyle

fun Modifier.fontStyle(value: FontStyle): Modifier

fontVariant

fun Modifier.fontVariant(scope: FontVariantScope.() -> Unit): Modifier

fun Modifier.fontVariant(alternates: FontVariantAlternates? = null, caps: FontVariantCaps? = null, eastAsian: FontVariantEastAsian? = null, emoji: FontVariantEmoji? = null, ligatures: FontVariantLigatures? = null, numeric: FontVariantNumeric? = null, position: FontVariantPosition? = null): Modifier

fontVariationSettings

fun Modifier.fontVariationSettings(value: FontVariationSettings): Modifier

fun Modifier.fontVariationSettings(vararg axes: FontVariationSettings.Axis): Modifier

fontWeight

fun Modifier.fontWeight(value: FontWeight): Modifier

fun Modifier.fontWeight(value: Int): Modifier

gap

fun Modifier.gap(value: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.gap(rowGap: CSSLengthOrPercentageNumericValue, columnGap: CSSLengthOrPercentageNumericValue): Modifier

grid

fun Modifier.grid(block: GridBuilder.() -> Unit): Modifier

gridArea

fun Modifier.gridArea(rowStart: String): Modifier

fun Modifier.gridArea(rowStart: String, columnStart: String): Modifier

fun Modifier.gridArea(rowStart: String, columnStart: String, rowEnd: String): Modifier

fun Modifier.gridArea(rowStart: String, columnStart: String, rowEnd: String, columnEnd: String): Modifier

gridAutoColumns

fun Modifier.gridAutoColumns(value: GridAuto): Modifier

fun Modifier.gridAutoColumns(block: GridTrackBuilder.() -> Unit): Modifier

gridAutoFlow

fun Modifier.gridAutoFlow(value: GridAutoFlow): Modifier

gridAutoRows

fun Modifier.gridAutoRows(value: GridAuto): Modifier

fun Modifier.gridAutoRows(block: GridTrackBuilder.() -> Unit): Modifier

gridColumn

fun Modifier.gridColumn(value: String): Modifier

fun Modifier.gridColumn(start: Int, end: Int = start + 1): Modifier

fun Modifier.gridColumn(start: Int, end: String): Modifier

fun Modifier.gridColumn(start: String, end: Int): Modifier

fun Modifier.gridColumn(start: String, end: String): Modifier

gridColumnEnd

fun Modifier.gridColumnEnd(value: Int): Modifier

fun Modifier.gridColumnEnd(value: String): Modifier

gridColumnStart

fun Modifier.gridColumnStart(value: Int): Modifier

fun Modifier.gridColumnStart(value: String): Modifier

gridItem

fun Modifier.gridItem(row: Int, column: Int, width: Int? = null, height: Int? = null): Modifier

A convenience modifier for specifying both row and column indices at the same time.

gridRow

fun Modifier.gridRow(value: String): Modifier

fun Modifier.gridRow(start: Int, end: Int = start + 1): Modifier

fun Modifier.gridRow(start: Int, end: String): Modifier

fun Modifier.gridRow(start: String, end: Int): Modifier

fun Modifier.gridRow(start: String, end: String): Modifier

gridRowEnd

fun Modifier.gridRowEnd(value: Int): Modifier

fun Modifier.gridRowEnd(value: String): Modifier

gridRowStart

fun Modifier.gridRowStart(value: Int): Modifier

fun Modifier.gridRowStart(value: String): Modifier

gridTemplateAreas

fun Modifier.gridTemplateAreas(vararg rows: String): Modifier

gridTemplateColumns

fun Modifier.gridTemplateColumns(value: GridTemplate): Modifier

fun Modifier.gridTemplateColumns(block: GridTrackBuilder.() -> Unit): Modifier

gridTemplateRows

fun Modifier.gridTemplateRows(value: GridTemplate): Modifier

fun Modifier.gridTemplateRows(block: GridTrackBuilder.() -> Unit): Modifier

height

fun Modifier.height(height: Height): Modifier

fun Modifier.height(size: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.height(auto: CSSAutoKeyword): Modifier

heightIn

fun Modifier.heightIn(min: CSSLengthOrPercentageNumericValue? = null, max: CSSLengthOrPercentageNumericValue? = null): Modifier

hidden

fun Modifier.hidden(): Modifier

fun Modifier.id(value: String): Modifier

isolation

fun Modifier.isolation(isolation: Isolation): Modifier

justifyContent

fun Modifier.justifyContent(justifyContent: JustifyContent): Modifier

justifyItems

fun Modifier.justifyItems(justifyItems: JustifyItems): Modifier

justifySelf

fun Modifier.justifySelf(justifySelf: JustifySelf): Modifier

lang

fun Modifier.lang(value: String): Modifier

left

fun Modifier.left(left: Left): Modifier

fun Modifier.left(value: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.left(value: CSSAutoKeyword): Modifier

letterSpacing

fun Modifier.letterSpacing(value: CSSLengthNumericValue): Modifier

lineHeight

fun Modifier.lineHeight(lineHeight: LineHeight): Modifier

fun Modifier.lineHeight(value: Number): Modifier

fun Modifier.lineHeight(value: CSSLengthOrPercentageNumericValue): Modifier

listStyle

fun Modifier.listStyle(type: ListStyleType? = null, position: ListStylePosition? = null, image: ListStyleImage? = null): Modifier

margin

fun Modifier.margin(scope: MarginScope.() -> Unit): Modifier

fun Modifier.margin(all: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.margin(topBottom: CSSLengthOrPercentageNumericValue = 0.px, leftRight: CSSLengthOrPercentageNumericValue = 0.px): Modifier

fun Modifier.margin(top: CSSLengthOrPercentageNumericValue = 0.px, leftRight: CSSLengthOrPercentageNumericValue = 0.px, bottom: CSSLengthOrPercentageNumericValue = 0.px): Modifier

fun Modifier.margin(top: CSSLengthOrPercentageNumericValue = 0.px, right: CSSLengthOrPercentageNumericValue = 0.px, bottom: CSSLengthOrPercentageNumericValue = 0.px, left: CSSLengthOrPercentageNumericValue = 0.px): Modifier

marginBlock

fun Modifier.marginBlock(scope: MarginBlockScope.() -> Unit): Modifier

fun Modifier.marginBlock(both: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.marginBlock(start: CSSLengthOrPercentageNumericValue = 0.px, end: CSSLengthOrPercentageNumericValue = 0.px): Modifier

marginInline

fun Modifier.marginInline(scope: MarginInlineScope.() -> Unit): Modifier

fun Modifier.marginInline(both: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.marginInline(start: CSSLengthOrPercentageNumericValue = 0.px, end: CSSLengthOrPercentageNumericValue = 0.px): Modifier

maxHeight

fun Modifier.maxHeight(maxHeight: MaxHeight): Modifier

fun Modifier.maxHeight(size: CSSLengthOrPercentageNumericValue): Modifier

maxSize

fun Modifier.maxSize(size: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.maxSize(width: CSSLengthOrPercentageNumericValue, height: CSSLengthOrPercentageNumericValue): Modifier

maxWidth

fun Modifier.maxWidth(maxWidth: MaxWidth): Modifier

fun Modifier.maxWidth(size: CSSLengthOrPercentageNumericValue): Modifier

minHeight

fun Modifier.minHeight(minHeight: MinHeight): Modifier

fun Modifier.minHeight(size: CSSLengthOrPercentageNumericValue): Modifier

minSize

fun Modifier.minSize(size: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.minSize(width: CSSLengthOrPercentageNumericValue, height: CSSLengthOrPercentageNumericValue): Modifier

minWidth

fun Modifier.minWidth(minWidth: MinWidth): Modifier

fun Modifier.minWidth(size: CSSLengthOrPercentageNumericValue): Modifier

mixBlendMode

fun Modifier.mixBlendMode(blendMode: MixBlendMode): Modifier

objectFit

fun Modifier.objectFit(objectFit: ObjectFit): Modifier

onAnimationEnd

fun Modifier.onAnimationEnd(listener: (SyntheticAnimationEvent) -> Unit): Modifier

onAnimationIteration

fun Modifier.onAnimationIteration(listener: (SyntheticAnimationEvent) -> Unit): Modifier

onAnimationStart

fun Modifier.onAnimationStart(listener: (SyntheticAnimationEvent) -> Unit): Modifier

onBlur

fun Modifier.onBlur(listener: (SyntheticFocusEvent) -> Unit): Modifier

onClick

fun Modifier.onClick(listener: (SyntheticMouseEvent) -> Unit): Modifier

onContextMenu

fun Modifier.onContextMenu(listener: (SyntheticMouseEvent) -> Unit): Modifier

onCopy

fun Modifier.onCopy(listener: (SyntheticClipboardEvent) -> Unit): Modifier

onCut

fun Modifier.onCut(listener: (SyntheticClipboardEvent) -> Unit): Modifier

onDoubleClick

fun Modifier.onDoubleClick(listener: (SyntheticMouseEvent) -> Unit): Modifier

onDrag

fun Modifier.onDrag(listener: (SyntheticDragEvent) -> Unit): Modifier

onDragEnd

fun Modifier.onDragEnd(listener: (SyntheticDragEvent) -> Unit): Modifier

onDragEnter

fun Modifier.onDragEnter(listener: (SyntheticDragEvent) -> Unit): Modifier

onDragLeave

fun Modifier.onDragLeave(listener: (SyntheticDragEvent) -> Unit): Modifier

onDragOver

fun Modifier.onDragOver(listener: (SyntheticDragEvent) -> Unit): Modifier

onDragStart

fun Modifier.onDragStart(listener: (SyntheticDragEvent) -> Unit): Modifier

onDrop

fun Modifier.onDrop(listener: (SyntheticDragEvent) -> Unit): Modifier

onFocus

fun Modifier.onFocus(listener: (SyntheticFocusEvent) -> Unit): Modifier

onFocusIn

fun Modifier.onFocusIn(listener: (SyntheticFocusEvent) -> Unit): Modifier

onFocusOut

fun Modifier.onFocusOut(listener: (SyntheticFocusEvent) -> Unit): Modifier

onKeyDown

fun Modifier.onKeyDown(listener: (SyntheticKeyboardEvent) -> Unit): Modifier

onKeyUp

fun Modifier.onKeyUp(listener: (SyntheticKeyboardEvent) -> Unit): Modifier

onMouseDown

fun Modifier.onMouseDown(listener: (SyntheticMouseEvent) -> Unit): Modifier

onMouseEnter

fun Modifier.onMouseEnter(listener: (SyntheticMouseEvent) -> Unit): Modifier

onMouseLeave

fun Modifier.onMouseLeave(listener: (SyntheticMouseEvent) -> Unit): Modifier

onMouseMove

fun Modifier.onMouseMove(listener: (SyntheticMouseEvent) -> Unit): Modifier

onMouseOut

fun Modifier.onMouseOut(listener: (SyntheticMouseEvent) -> Unit): Modifier

onMouseOver

fun Modifier.onMouseOver(listener: (SyntheticMouseEvent) -> Unit): Modifier

onMouseUp

fun Modifier.onMouseUp(listener: (SyntheticMouseEvent) -> Unit): Modifier

onPaste

fun Modifier.onPaste(listener: (SyntheticClipboardEvent) -> Unit): Modifier

onScroll

fun Modifier.onScroll(listener: (SyntheticEvent<EventTarget>) -> Unit): Modifier

onTouchCancel

fun Modifier.onTouchCancel(listener: (SyntheticTouchEvent) -> Unit): Modifier

onTouchEnd

fun Modifier.onTouchEnd(listener: (SyntheticTouchEvent) -> Unit): Modifier

onTouchMove

fun Modifier.onTouchMove(listener: (SyntheticTouchEvent) -> Unit): Modifier

onTouchStart

fun Modifier.onTouchStart(listener: (SyntheticTouchEvent) -> Unit): Modifier

onTransitionCancel

fun Modifier.onTransitionCancel(listener: (SyntheticTransitionEvent) -> Unit): Modifier

onTransitionEnd

fun Modifier.onTransitionEnd(listener: (SyntheticTransitionEvent) -> Unit): Modifier

onTransitionRun

fun Modifier.onTransitionRun(listener: (SyntheticTransitionEvent) -> Unit): Modifier

onTransitionStart

fun Modifier.onTransitionStart(listener: (SyntheticTransitionEvent) -> Unit): Modifier

onWheel

fun Modifier.onWheel(listener: (SyntheticMouseEvent) -> Unit): Modifier

opacity

fun Modifier.opacity(value: Number): Modifier

fun Modifier.opacity(value: CSSPercentageNumericValue): Modifier

order

fun Modifier.order(value: Int): Modifier

outline

fun Modifier.outline(width: CSSLengthNumericValue? = null, style: LineStyle? = null, color: CSSColorValue? = null): Modifier

outlineColor

fun Modifier.outlineColor(outlineColor: OutlineColor): Modifier

fun Modifier.outlineColor(value: CSSColorValue): Modifier

outlineOffset

fun Modifier.outlineOffset(value: CSSLengthNumericValue): Modifier

outlineStyle

fun Modifier.outlineStyle(value: LineStyle): Modifier

outlineWidth

fun Modifier.outlineWidth(outlineWidth: OutlineWidth): Modifier

fun Modifier.outlineWidth(value: CSSLengthNumericValue): Modifier

overflow

fun Modifier.overflow(overflow: Overflow): Modifier

fun Modifier.overflow(scope: OverflowScope.() -> Unit): Modifier

fun Modifier.overflow(overflowX: Overflow, overflowY: Overflow): Modifier

overflowWrap

fun Modifier.overflowWrap(overflowWrap: OverflowWrap): Modifier

overscrollBehavior

fun Modifier.overscrollBehavior(overscrollBehavior: OverscrollBehavior): Modifier

fun Modifier.overscrollBehavior(scope: OverscrollBehaviorScope.() -> Unit): Modifier

fun Modifier.overscrollBehavior(x: OverscrollBehavior.RepeatableValue, y: OverscrollBehavior.RepeatableValue): Modifier

overscrollBehaviorBlock

fun Modifier.overscrollBehaviorBlock(x: OverscrollBehavior.SingleValue): Modifier

overscrollBehaviorInline

fun Modifier.overscrollBehaviorInline(y: OverscrollBehavior.SingleValue): Modifier

padding

fun Modifier.padding(scope: PaddingScope.() -> Unit): Modifier

fun Modifier.padding(all: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.padding(topBottom: CSSLengthOrPercentageNumericValue = 0.px, leftRight: CSSLengthOrPercentageNumericValue = 0.px): Modifier

fun Modifier.padding(top: CSSLengthOrPercentageNumericValue = 0.px, leftRight: CSSLengthOrPercentageNumericValue = 0.px, bottom: CSSLengthOrPercentageNumericValue = 0.px): Modifier

fun Modifier.padding(top: CSSLengthOrPercentageNumericValue = 0.px, right: CSSLengthOrPercentageNumericValue = 0.px, bottom: CSSLengthOrPercentageNumericValue = 0.px, left: CSSLengthOrPercentageNumericValue = 0.px): Modifier

paddingBlock

fun Modifier.paddingBlock(scope: PaddingBlockScope.() -> Unit): Modifier

fun Modifier.paddingBlock(both: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.paddingBlock(start: CSSLengthOrPercentageNumericValue = 0.px, end: CSSLengthOrPercentageNumericValue = 0.px): Modifier

paddingInline

fun Modifier.paddingInline(scope: PaddingInlineScope.() -> Unit): Modifier

fun Modifier.paddingInline(both: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.paddingInline(start: CSSLengthOrPercentageNumericValue = 0.px, end: CSSLengthOrPercentageNumericValue = 0.px): Modifier

placeContent

fun Modifier.placeContent(alignContent: AlignContent, justifyContent: JustifyContent): Modifier

placeItems

fun Modifier.placeItems(alignItems: AlignItems, justifyItems: JustifyItems): Modifier

placeSelf

fun Modifier.placeSelf(alignSelf: AlignSelf, justifySelf: JustifySelf): Modifier

pointerEvents

fun Modifier.pointerEvents(pointerEvents: PointerEvents): Modifier

position

fun Modifier.position(position: Position): Modifier

resize

fun Modifier.resize(resize: Resize): Modifier

right

fun Modifier.right(right: Right): Modifier

fun Modifier.right(value: CSSLengthOrPercentageNumericValue): Modifier

fun Modifier.right(value: CSSAutoKeyword): Modifier

role

fun Modifier.role(value: String): Modifier

rotate

fun Modifier.rotate(a: CSSAngleValue): Modifier

fun Modifier.rotate(x: Number, y: Number, z: Number, a: CSSAngleValue): Modifier

rotateX

fun Modifier.rotateX(ax: CSSAngleValue): Modifier

rotateY

fun Modifier.rotateY(ay: CSSAngleValue): Modifier

rotateZ

fun Modifier.rotateZ(az: CSSAngleValue): Modifier

rowClasses

fun Modifier.rowClasses(horizontalArrangement: Arrangement.Horizontal = RowDefaults.HorizontalArrangement, verticalAlignment: Alignment.Vertical = RowDefaults.VerticalAlignment): Modifier

Add classes that tell the browser to display this element as a row.

rowGap