TallyT
Tally
Oct 24

Custom CSS classes per blocks

Add the option to assign a custom class to a block so that it would be easier to work with CSS without relying on classes automatically generated per each block. If now if I want to style only 3 text blocks out of 5 (so not being able to just use the general class ".tally-block-text"), I will have to find the classes for all the blocks (something like ".tally-block-5314f640-6bcc-4048-b5c0-74bddf4006c5" etc.) and then use them in the css specification. With the new feature I will only have to define CSS for a class ".beautiful-block" and then assign this class to the three blocks. I would also be able to use the same custom class over multiple forms on the same domain and define the CSS properties only once via code injection.
CompletedCompleted

Feb 19, 2025

Thanks for your response and for providing the link to the supported CSS classes. However, this request hasn't been fully addressed. The current solution—using .tally-block-[UUID]—only allows us to style blocks individually based on their unique identifiers. What was requested was the ability to assign a custom class name to a block so that we can target specific groups of blocks with a shared CSS rule, rather than having to style each block one by one using UUIDs. For example, if we wanted to style only three text blocks out of five, we currently have to find and list their unique class names individually in our CSS. With the requested feature, we could simply assign a class like .beautiful-block to those three blocks and apply styles to them all at once. This would also allow us to reuse the same class across multiple forms on the same domain, making styling much more efficient.

Jan 25, 2026

Fully agree... would love this too!

Feb 19, 2025

This is possible via this class name for Tally block by UUID (Universal Unique Identifier) .tally-block-[UUID] (example: .tally-block-2e9cd30c-28e1-4c56-a1ef-d8e945ac103e) You can find it in the CSS classes we support here: https://tally.so/help/add-custom-stylesin

Nov 22, 2023

Found this to be my temporary solution: /* Target all direct child divs of .tally-multiple-choice-option */ .tally-multiple-choice-option > div { width: 100%; }

Nov 23, 2023

Videoath: thanks for the CSS tip, with my suggestion I was meaning something even more precise, hopefully this will be implemented in the future

Nov 12, 2023

This is the only thing we've found missing from Tally and would love to see it implemented. Our #1 feature request.