N8N Form node Custom Styling (multiple columns)

[n8nnoob]

Describe the problem/error/question

I am trying to make this form a bit more user friendly. I’m trying to use the Custom Styling, but am having a bit of trouble getting the right changes. I’ve consulted with the AI as well, and haven’t had much luck. I have a few things I am trying to do:

• Make it 2-3 columns for the options.
• Is there a way to change text size of the multi-select options and not the Header (1. select all…)? I’ve tried --font-size-label: 28px; but it seems to change both sizes
• Is there a way to add a background image?
• Is all of the custom styling options required? will anything happen if I delete all the ones that i don’t change?

Please share your workflow

Below is what the node currently is

Any advice would be helpful! Thanks in advance

[jcuypers]

Hi, as from what I can find, this isn’t currently possible but there might be in the future.

Embedded or not, will need to see.

Options for customising the N8N Forms when embedded

The idea is: To be able to customise the forms’ design when we embed them on a website. I’d like to personalise the texts (label, input text, titles…), the input fields, the form container, the buttons… Either through a N8N interface or via custom code ; same as for embedding chatbot widgets. My use case: I am currently using Hubspot forms for my website to capture leads but I like the options that N8N forms can allow to improve the user experience but the current form design doesn’t match my…

Reg,
J.

[jcuypers]

If if would be CSS based you would only change what is needed