Styling Forms

You can now visually style your forms in Pulse using the built-in CSS Style panel. This lets you control spacing, fonts, colors, borders and layout directly from the editor, without needing to write any code yourself.

When to use styling

• Make forms more compact or add extra spacing for clarity.
• Change background or border colors to highlight important areas.
• Use consistent fonts and sizes to match your branding.
• Control the width of the form.

How to style a form

1. Add or select a Form on your dashboard.
2. Open the Form Editor (click the gear icon while editing).
3. Scroll to the CSS Style section and expand it.
4. Adjust the options you want (spacing, font, colors, borders, etc.).
5. Click Clear Style at any time to reset back to default.

What you can change

Group	Option	Description	Examples
Spacing	Margin	Space outside the form (distance from other content).	12px · 20% · 1rem
	Padding	Space inside the form (around the widgets).	8px · 5% · 2em
Font	Font Size	How large the text appears.	12px · 14px · 1.2em
	Font Style	Italic, oblique or normal text.	normal · italic
	Font Weight	Thickness of the text.	normal · bold
Colors	Text Color	Pick a color for labels and text.	#000000 (black) · #ff0000 (red)
	Background Color	Fill color behind the form.	#ffffff (white) · #f0f0f0 (light gray)
Border	Border Width	Thickness of the border line.	1px · 2px
	Border Style	Type of border line.	solid · dashed · dotted
	Border Color	Color of the border line.	#d1d5db (light gray)
Layout	Display & Gap	Choose between simple block layout or advanced grid/flex layouts. “Gap” sets spacing between widgets when using grid/flex.	8px · 10% · 0.5rem
Size	Width / Max Width	Control how wide the form can grow.	320px · 960px · 100%

Units you can use

Most size fields accept simple numbers or full units:

• px — fixed size in pixels (e.g. 12px).
• % — percentage of the available space (e.g. 100%).
• em/rem — relative sizes (e.g. 1.2em, 0.5rem).

If you type just a number (like 12), it will be treated as pixels.