Most blocks share the same set of styling controls. Instead of repeating them on every page, they are documented once here. When a component page says "see Common Fields", this is where it points.
Select any block on the canvas and these sections appear in the Fields panel.
Typography
Controls how text looks. It appears on any block that shows text, such as Text and Button.
In the editor this section is labelled "Typhography". It behaves exactly as described below.
Font FamilyDropdown
The typeface used for the text. Search by name to find one.
Font WeightDropdown
How thick the text is, for example Regular or Bold. The choices depend on the selected font.
Font SizeDropdown / number
The size of the text in pixels. Pick a preset or type your own value.
Letter SpacingDropdown / number
The gap between letters. Leave on Auto for the font's normal spacing.
Line HeightDropdown / number
The vertical space between lines of text.
AlignmentToggle
Aligns the text to the left, center, right, or justified.
Font ColorColor
The text colour. Supports a solid colour, an image fill, or a gradient, each with adjustable opacity.
Appearance
Controls the size, background, and spacing of the block's box.
DimensionsToggle + number
Sets Width and Height. Leave on Auto to size to the content, or switch to Fixed and enter a value with a unit (px, %, vh, vw, rem, em).
BackgroundColor
The fill behind the block. Supports a solid colour, an image, or a gradient.
Background OverlayColor
A second colour or gradient layer on top of the background, handy for tinting an image.
OpacityNumber
How see-through the whole block is, from 0 to 100.
PaddingNumber
Space inside the block, between its edge and its content. Set one value for all sides, or switch to per-side values for top, bottom, left, and right.
MarginNumber
Space outside the block, between it and its neighbours. Also supports per-side values.
Border
Controls the outline and rounded corners of the block.
Border WidthNumber
How thick the outline is. Set one value for all sides or per side. At 0 there is no border.
Border ColorColor
The colour of the outline. It becomes active once the width is above 0.
Corner RadiusDropdown / number
How rounded the corners are. Set all corners together or each corner separately. "Full" makes a pill or circle.
Click Event
Lets a block do something when a visitor taps it. Available on Button, Icon Button, and Container.
Enable Click EventToggle
Turn this on to make the block respond to a tap.
TypeDropdown
Choose what happens: Link (open a web address), Subscription (open an email sign-up), or Lemon Squeezy (open a product checkout overlay).
URL / Checkout URLText
The web address to open. For Link it is any URL; for Lemon Squeezy it is your product's checkout URL.
An optional entrance animation that plays as the block scrolls into view. Only the Container exposes this, so to animate any other block, wrap it in a Container and set the animation there. For a full walkthrough, see Adding Animation.
Enable Entrance AnimationToggle
Turns the animation on.
Animation TypeDropdown
Fade In or Bounce In.
Animation SourceDropdown
Where it animates from: Center, Top, Right, Left, or Bottom.
Duration (seconds)Number
How long the animation runs.
Delay (seconds)Number
How long to wait before it starts.
Position and Layout
Extra sections that appear on layout blocks.
Position
Fine control over where the block sits. Available on the Container.
Layout
Appears when a block is nested inside a Grid or another Container, and controls how it fits within its parent.
Animation and Click Event live on a few blocks only
Animation is on the Container only, and Click Event is on Button, Icon Button, and Container. To give any other block an entrance animation or a click action, wrap it in a Container.
