Styling conflicts with Chosen dropdown and Image Choice in Gravity Forms

Get Help
1

Hi everyone,

I’m styling a Gravity Form inside a WordPress site that uses a dark custom theme (black background layout) and Elementor.

I’m experiencing styling conflicts between:

• The theme’s default styles (which force dark/grey text)

• Gravity Forms

• Chosen (for select fields)

• Image Choice selected states

Specific issues:

  1. Labels such as “Name”, “Email”, etc. appear in dark grey because they inherit the theme’s typography styles, even when I try to override them.

  2. The select dropdown uses Chosen and applies default highlight colors (blue/purple) that override my brand color.

  3. The Image Choice field shows a blue selected state/check that conflicts with my brand accent (#fb7043).

  4. Global text color overrides also unintentionally affect elements like image choice labels.

Brand context:

• Dark theme (black background)

• Accent color: #fb7043

Goal:

• Clean dark layout

• Consistent white text where needed

• Brand-colored selected states

• No default blue/purple highlights

What would be the best practice approach here?

Should I:

– Disable Chosen?

– Scope all styles with a wrapper class?

– Override specific Chosen classes?

– Or rely on Gravity’s built-in theme settings?

I’d like to avoid stacking CSS hacks and instead apply a stable and maintainable solution.

Thank you in advance.

2

@user69a2cd8ec14d5379 I consider all options valid, as it depends on the application requirements. I believe fixing this at the architectural level can be difficult, since each theme is different and multiple plugins introduce their own CSS.

I usually solve this by adding a wrapper class and then overriding the CSS.