✦ Add a new rayAñadir un ray nuevo

Fill the form. Copy the generated HTML + CSS into flovy.html and you've got a new ray in the ✨ magic dropdown.Rellena el formulario. Copia el HTML + CSS generado en flovy.html y tendrás un ray nuevo en el desplegable ✨ magic.

Import existing ray block (paste & pre-fill)

Paste a body:has(#X:checked){ … } block from flovy.html. The fields below will be filled in.

loaded.
Identity

The ray ID is used as the radio input id (my-labeler → #my-labeler). Keep it short, lowercase, kebab-case.

📚 Pick from icon library…

SVG or square PNG/JPG. Suggested: 64×64 px, transparent background, under 50 KB. Larger files are accepted but may slow rendering on small UI cells.

Topbar (logo · title · slogan)
--labeler-logo
--labeler-title
--labeler-title-scale
--labeler-slogan
Notes section
--labeler-section-title
--labeler-section-tagline
Step panels (titles & intros)

Steps 2–5 in the stepper: Backgrounds, Animations, Text, Summary. Leave blank to keep the default.

--labeler-panel-2-title
--labeler-panel-2-intro
--labeler-panel-3-title
--labeler-panel-3-intro
--labeler-panel-4-title
--labeler-panel-4-intro
--labeler-panel-5-title
--labeler-panel-5-intro
--labeler-panel-6-title
Stepper labels

Short lowercase labels under each step node. Only shown if the toggle below is on.

Action labels
--labeler-textarea-hint
--labeler-add-label
--labeler-rater-label
Rater emoji (4 cells)

Each cell shows a different reaction. Leave all blank to keep the default emoji.