Float

Overview

A float block that wraps other theme or app blocks and positions them absolutely according to x and y coordinate settings. Supports responsive positioning for different desktop and mobile layouts with rotation effects for dynamic floating content.

Common use cases

• Position blocks at specific coordinates on the page for floating elements like tooltips, badges, or overlays

• Ensure the parent container has position: relative for proper positioning

• Use responsive positioning for different desktop and mobile layouts

• Apply rotation effects for dynamic floating content

Compatible blocks

The following blocks can be nested within this block:

• All theme blocks

• App blocks

Block settings

General

Setting	Description	Options
Show advanced settings	Reveals enable color difference, visibility, load animation, and scroll animation	Checkbox (default: false)

Color

Setting	Description	Options
Color scheme	Controls the background and text colors	• Body • Neutral • Accent 1 • Accent 2 • Accent 3 • Shade 1 • Shade 2 • Shade 3 • Primary • Secondary • Tertiary • Blur • Transparent (default)
Color border	Controls the border color	• Body • Subtle (default) • Strong • Primary • Secondary • Tertiary • None Visible when border position is not blank
Enable color difference	Applies mix-blend-difference for visual contrast	Checkbox (default: false) Visible when Show advanced settings is on

Style

Setting	Description	Options
Border position	Controls where borders appear	• None (default) • Top • Bottom • Left • Right • Top and bottom • Left and right • All

Layout (desktop)

Setting	Description	Options
Vertical alignment	Vertical position percentage on desktop	0 - 100 % (default: 50)
Horizontal alignment	Horizontal position percentage on desktop	0 - 100 % (default: 50)
Width	Width of the floating block as viewport percentage	5 - 100 % (default: 30)
Rotation	Rotation angle in degrees	0 - 360 deg (default: 15)

Layout (mobile)

Setting	Description	Options
Vertical alignment	Vertical position percentage on mobile	0 - 100 % (default: 50)
Horizontal alignment	Horizontal position percentage on mobile	0 - 100 % (default: 50)
Width	Width of the floating block as viewport percentage	5 - 100 % (default: 70)
Rotation	Rotation angle in degrees	0 - 360 deg (default: 15)

Display

Setting	Description	Options
Visibility	Controls when the block is visible	• All (default) • Mobile only • Desktop only Visible when Show advanced settings is on
Load animation	Animation when the block first loads	• None (default) • Fade • Fade up • Offset fade • Offset fade up Visible when Show advanced settings is on and Scroll animation is None
Scroll animation	Adds scroll-triggered animations	• None (default) • Fade • Slide up • Slide down • Slide left • Slide right • Zoom Visible when Show advanced settings is on and Load animation is None