Struct Style 

pub struct Style {

    pub display: Option<Display>,
    pub box_sizing: Option<BoxSizing>,
    pub position_type: Option<PositionType>,
    pub overflow_x: Option<OverflowAxis>,
    pub overflow_y: Option<OverflowAxis>,
    pub scrollbar_width: Option<f32>,
    pub left: Option<Length>,
    pub right: Option<Length>,
    pub top: Option<Length>,
    pub bottom: Option<Length>,
    pub width: Option<Length>,
    pub height: Option<Length>,
    pub min_width: Option<Length>,
    pub min_height: Option<Length>,
    pub max_width: Option<Length>,
    pub max_height: Option<Length>,
    pub aspect_ratio: Option<f32>,
    pub align_items: Option<AlignItems>,
    pub justify_items: Option<JustifyItems>,
    pub align_self: Option<AlignSelf>,
    pub justify_self: Option<JustifySelf>,
    pub align_content: Option<AlignContent>,
    pub justify_content: Option<JustifyContent>,
    pub margin: Option<Rect>,
    pub padding: Option<Rect>,
    pub border: Option<Rect>,
    pub flex_direction: Option<FlexDirection>,
    pub flex_wrap: Option<FlexWrap>,
    pub flex_grow: Option<f32>,
    pub flex_shrink: Option<f32>,
    pub flex_basis: Option<Length>,
    pub gap: Option<Length>,
    pub row_gap: Option<Length>,
    pub column_gap: Option<Length>,
    pub grid_auto_flow: Option<GridAutoFlow>,
    pub grid_template_rows: Option<Vec<RepeatedGridTrack>>,
    pub grid_template_columns: Option<Vec<RepeatedGridTrack>>,
    pub grid_auto_rows: Option<Vec<GridTrack>>,
    pub grid_auto_columns: Option<Vec<GridTrack>>,
    pub grid_row: Option<GridPlacement>,
    pub grid_column: Option<GridPlacement>,
    pub background_color: Option<String>,
    pub border_color: Option<BorderColorSpec>,
    pub border_radius: Option<Rect>,
    pub outline: Option<OutlineSpec>,
    pub box_shadow: Option<BoxShadowList>,
    pub filter: Option<FilterSpec>,
    pub background_gradient: Option<GradientList>,
    pub border_gradient: Option<GradientList>,
    pub z_index: Option<i32>,
    pub global_z_index: Option<i32>,
    pub focus_policy: Option<FocusPolicy>,
    pub cursor: Option<String>,
    pub transform: Option<Transform>,
    pub opacity: Option<f32>,
    pub transition: Option<Transition>,
    pub color: Option<String>,
    pub font_size: Option<FontSize>,
    pub font_weight: Option<FontWeight>,
    pub font_family: Option<String>,
    pub text_align: Option<Justify>,
    pub line_height: Option<LineHeightSpec>,
    pub letter_spacing: Option<LetterSpacingSpec>,
    pub text_shadow: Option<TextShadowSpec>,
    pub line_break: Option<LineBreak>,
}

A CSS-like style object mapped onto bevy_ui::Node and its sibling visual components. Every field is optional; unset fields keep Bevy’s defaults.

Length-valued fields accept a bare number (logical pixels) or a unit string ("50%", "100vw", "auto", "10px"). Rect-valued fields (margin/padding/border/borderRadius) accept a number (uniform), a CSS shorthand string ("8px 16px"), or a { top, right, bottom, left } object. Keyword-valued fields (display, align*, flex*, …) decode straight into the bevy_ui/bevy_text enum they drive (see the keyword_fields! deserializers below); an unrecognized keyword warns and falls back to the bevy default. Grid tracks/placements likewise parse once at decode.

Fields

display: Option<Display>

box_sizing: Option<BoxSizing>

position_type: Option<PositionType>

overflow_x: Option<OverflowAxis>

overflow_y: Option<OverflowAxis>

scrollbar_width: Option<f32>

left: Option<Length>

right: Option<Length>

top: Option<Length>

bottom: Option<Length>

width: Option<Length>

height: Option<Length>

min_width: Option<Length>

min_height: Option<Length>

max_width: Option<Length>

max_height: Option<Length>

aspect_ratio: Option<f32>

align_items: Option<AlignItems>

justify_items: Option<JustifyItems>

align_self: Option<AlignSelf>

justify_self: Option<JustifySelf>

align_content: Option<AlignContent>

justify_content: Option<JustifyContent>

margin: Option<Rect>

padding: Option<Rect>

border: Option<Rect>

flex_direction: Option<FlexDirection>

flex_wrap: Option<FlexWrap>

flex_grow: Option<f32>

flex_shrink: Option<f32>

flex_basis: Option<Length>

gap: Option<Length>

row_gap: Option<Length>

column_gap: Option<Length>

grid_auto_flow: Option<GridAutoFlow>

grid_template_rows: Option<Vec<RepeatedGridTrack>>

CSS grid template ("repeat(3, 1fr)", "1fr 2fr 100px", "auto").

grid_template_columns: Option<Vec<RepeatedGridTrack>>

grid_auto_rows: Option<Vec<GridTrack>>

Auto-track sizing (grid-auto-rows/columns); no repeat().

grid_auto_columns: Option<Vec<GridTrack>>

grid_row: Option<GridPlacement>

Grid line placement ("1 / 3", "span 2", "2", "auto").

grid_column: Option<GridPlacement>

background_color: Option<String>

Hex background color (#rrggbb / #rrggbbaa).

border_color: Option<BorderColorSpec>

Border color: a single CSS color (all four sides) or a { top, right, bottom, left } object (omitted sides → transparent).

border_radius: Option<Rect>

Corner radii; same forms as the other rect fields (corners are top-left, top-right, bottom-right, bottom-left).

outline: Option<OutlineSpec>

box_shadow: Option<BoxShadowList>

filter: Option<FilterSpec>

CSS-like filter: per-pixel visual effects (blur, brightness, contrast, saturate, grayscale, sepia, invert, hueRotate) applied to the element’s own surface (its image or background) via a custom UiMaterial shader. Unlike CSS it does not cascade to descendants — a MaterialNode renders only the node itself, so children/text draw on top unfiltered. Present → the reconciler swaps the node’s ImageNode / BackgroundColor draw for a MaterialNode<FilterMaterial> (see [crate::filter]).

background_gradient: Option<GradientList>

Background gradient(s); one gradient or a layered list. bevy paints it over backgroundColor (CSS background-image semantics): an opaque gradient hides the color (fallback); transparent stops reveal it.

border_gradient: Option<GradientList>

Border gradient(s); one gradient or a layered list. Painted over borderColor (needs a border width to be visible).

z_index: Option<i32>

global_z_index: Option<i32>

Global stacking order: lifts the node (and its subtree) into the UI’s top-level stack, escaping the parent stacking context. Unlike z_index, which only reorders a node among its siblings.

focus_policy: Option<FocusPolicy>

Pointer pass-through. Maps to bevy::ui::FocusPolicy. "pass" lets pointer interaction fall through to nodes behind this one; "block" makes it capture interaction so siblings, the 3D scene, and portals behind it don’t receive it. When unset the default is element-dependent (set in the reconciler): a <button> blocks, a <node>/container passes.

cursor: Option<String>

Mouse cursor shown while the pointer is over this node (CSS cursor). A system keyword (winit’s SystemCursorIcon) or a custom-cursor name registered via ReactUiPlugin::cursor; the name is resolved (registry first, so a custom cursor can override a system keyword) onto the window’s CursorIcon by crate::cursor::drive_cursor_icon. Like font_family, a raw name resolved at drive time. Absent → the node contributes no cursor (its ancestor’s or the default arrow shows).

transform: Option<Transform>

Static transform (translate/scale/rotate). Mirrors the animated transform channels; written to UiTransform. With a transition a change eases instead of snapping.

opacity: Option<f32>

Opacity in 0.0..=1.0, multiplied into the alpha of the background (and text) color. With a transition a change eases.

transition: Option<Transition>

CSS-like per-channel transition timing. Present → a change to transform / opacity / backgroundColor (via re-render or hover/press) animates over time using the same driver/easing engine as animatedStyle, rather than snapping. See [crate::transition].

color: Option<String>

Hex text color.

font_size: Option<FontSize>

Font size: a number (logical pixels) or a unit string ("24px", "2vw", "1.5rem"). See FontSize.

font_weight: Option<FontWeight>

"thin" | "light" | "normal" | "medium" | "semibold" | "bold" | "black" or a numeric weight string (e.g. "600").

font_family: Option<String>

Registered font-family name to render this text with (see the plugin’s default_font/font config). Unknown or unset → the configured default font.

text_align: Option<Justify>

Horizontal alignment of the text block (<text> root only): "left" | "center" | "right" | "justify" | "start" | "end".

line_height: Option<LineHeightSpec>

Line height. A bare number is a multiple of the font size; { "px": n } is an absolute pixel height. Unset → bevy’s default (1.2× the font size).

letter_spacing: Option<LetterSpacingSpec>

Letter spacing. A bare number is logical pixels; { "rem": n } is a multiple of the font size. Unset → no extra spacing.

text_shadow: Option<TextShadowSpec>

A single drop shadow behind the text (<text> root only).

line_break: Option<LineBreak>

How the text wraps when it overflows its bounds (<text> root only): "wordBoundary" (default) | "anyCharacter" | "wordOrCharacter" | "noWrap".

Trait Implementations

impl Clone for Style

fn clone(&self) -> Style

Returns a duplicate of the value.

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source.

impl Debug for Style

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.

impl Default for Style

fn default() -> Style

Returns the “default value” for a type.

impl<'de> Deserialize<'de> for Style

fn deserialize<__D>(__deserializer: __D) -> Result<Self, __D::Error>

where __D: Deserializer<'de>,

Deserialize this value from the given Serde deserializer.