elementor / elementor/elementor

Atomic Form: Submit button hover color is always forced to #323232 and cannot be customized

Open
#36,466 0 comments 0 reactions 0 assignees View on GitHub
status/awaiting_triage
Dominant language
PHP
Stars
7.1k
Forks
1.6k
Avg merge
1d 5h
Merged PRs (30d)
193

Description

### Description

## Description

The Atomic Form widget automatically forces the Submit Button hover background color to `#323232`.

The normal button background color can be changed successfully, but there is currently no option to customize the hover color.

As a result, every custom button color changes to dark gray on hover.

## Steps to reproduce

1. Create a new blank page.
2. Insert a new Atomic Form widget.
3. Change the Submit Button background color (for example `#E9C267`).
4. Save the page.
5. Hover over the Submit Button.

## Expected behavior

The hover color should either:
- inherit the normal background color, or
- be configurable in the editor.

## Actual behavior

The hover background color is always generated as:

```css
.elementor .e-form-submit-button-base:hover,
.elementor .e-form-submit-button-base:focus-visible {
background-color: #323232;
}

This CSS is generated automatically in:
/wp-content/uploads/elementor/css/base-desktop.css

Environment
Elementor: 4.1.4
Elementor Pro: 4.1.2
Theme: Astra
Browser: Google Chrome
Additional information

The issue has been tested on:

a completely new blank page,
a brand new Atomic Form widget,
regenerated Elementor CSS & Data,
cleared cache,
no WPForms installed.

The issue is reproducible every time.

How i can transform hover button "sent" for

Image

### Steps to reproduce

1. Open the WordPress Dashboard.
2. Create a new blank page.
3. Edit the page with Elementor.
4. Drag and drop a new Atomic Form widget onto the page.
5. Select the Submit Button.
6. Change the button background color (for example to #E9C267).
7. Save the page and open the frontend.
8. Hover over the Submit Button.

Result:
The normal button color changes correctly, but the hover background color is always forced to #323232.

### Expected behavior

The Submit Button hover background color should either:

- inherit the selected button background color, or
- be configurable in the Atomic Form editor.

If the button background color is changed (for example to #E9C267), the hover state should not be automatically forced to #323232.

The editor should provide a way to customize the hover background color, just like other button styles.

### Elementor System Info

```txt
== Server Environment ==
Operating System: Linux
Software: Apache
MySQL version: MariaDB Server v10.11.16-MariaDB-log
PHP Version: 8.2.31
PHP Memory Limit: 512M
PHP Max Input Vars: 10000
PHP Max Post Size: 256M
GD Installed: Yes
ZIP Installed: Yes
Write Permissions: All right
Elementor Library: Connected

== WordPress Environment ==
Version: 7.0.1
Site URL: https://kuchynehlinsko.cz
Home URL: https://kuchynehlinsko.cz
WP Multisite: No
Max Upload Size: 256 MB
Memory limit: 40M
Max Memory limit: 512M
Permalink Structure: /%category%/%postname%/
Language: cs_CZ
Timezone: 2
Admin Email: vacek-lukas@email.cz
Debug Mode: Inactive

== Theme ==
Name: Astra
Version: 4.13.0
Author: Brainstorm Force
Child Theme: No

== User ==
Role: administrator
WP Profile lang: cs
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/150.0.0.0 Safari/537.36

== Active Plugins ==
Code Snippets
Version: 3.9.6
Author: Code Snippets Pro

Elementor
Version: 4.1.4
Author: Elementor.com

Elementor Pro
Version: 4.1.2
Author: Elementor.com

Limit Login Attempts Reloaded
Version: 2.25.26
Author: Limit Login Attempts Reloaded

Starter Templates
Version: 4.6.3
Author: Brainstorm Force

Starter Templates by Kadence WP
Version: 2.2.14
Author: Kadence WP

Ultimate Addons for Elementor (UAE)
Version: 2.8.7
Author: Brainstorm Force

== Použitím Elements ==

header : 2
button : 1
container : 5
e-heading : 1
heading : 1
icon-list : 2
image : 1
nav-menu : 1
wp-page : 4
button : 6
container : 26
e-form : 1
e-form-error-message : 1
e-form-input : 3
e-form-label : 4
e-form-submit-button : 1
e-form-success-message : 1
e-form-textarea : 1
e-image : 4
e-paragraph : 2
google_maps : 1
heading : 14
icon : 4
icon-box : 1
icon-list : 1
shortcode : 1
text-editor : 2

== Nastavení ==

allow_tracking: yes
unfiltered_files_upload: 1
font_display: swap

== Features ==
Custom Fonts: 0
Custom Icons: 0

== Integrations ==

== Experimenty Elementoru ==
Inline Font Icons: Ve výchozím stavu aktivní
Dodatečné vlastní body zalomení: Ve výchozím stavu aktivní
Kontejner: Ve výchozím stavu aktivní
Optimized Markup: Ve výchozím stavu aktivní
Panel Promotions: Ve výchozím stavu aktivní
Default to New Theme Builder: Ve výchozím stavu aktivní
Elementor MCP WP Abilities API: Ve výchozím stavu neaktivní
Pro Free Trial Popup: Ve výchozím stavu aktivní
Vložené prvky: Ve výchozím stavu aktivní
Panel stránek: Ve výchozím stavu neaktivní
Atomic Widgets: Ve výchozím stavu aktivní
V4 Indications Popover: Ve výchozím stavu neaktivní
Enforce atomic widgets capabilities: Ve výchozím stavu aktivní
Editor MCP pro atomické widgety: Ve výchozím stavu aktivní
Migrace pro zachování zpětné kompatibility: Ve výchozím stavu aktivní
CSS Grid: Ve výchozím stavu neaktivní
Editor design system panel: Ve výchozím stavu aktivní
Global Classes: Ve výchozím stavu aktivní
Enforce global classes capabilities: Ve výchozím stavu aktivní
Proměnné: Ve výchozím stavu aktivní
Variables Manager: Ve výchozím stavu aktivní
Editor v4 (Opt In Page): Ve výchozím stavu aktivní
Editor V4: Ve výchozím stavu aktivní
Components: Ve výchozím stavu aktivní
Interakce: Ve výchozím stavu aktivní
Tvorba widgetů: Ve výchozím stavu aktivní
Generate website markdown: Ve výchozím stavu neaktivní
Import/Export Customization: Ve výchozím stavu aktivní
Site Builder: Ve výchozím stavu neaktivní
Elementor Editor Events: Ve výchozím stavu aktivní
Atomic Form: Ve výchozím stavu aktivní
Collection Loop: Ve výchozím stavu neaktivní
Menu: Ve výchozím stavu aktivní
Size Variables: Ve výchozím stavu aktivní
Pro Interactions: Ve výchozím stavu aktivní
Odesílání zpětné vazby v editoru: Ve výchozím stavu neaktivní

== Log ==

JS: showing 9 of 9JS: 2026-04-22 15:20:52 [error X 1][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/js/admin.min.js?ver=4.0.2:2:42303] r.startsWith is not a function
JS: 2026-04-22 16:06:44 [error X 23][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/js/editor.min.js?ver=4.0.2:2:974715] Failed to execute 'querySelector' on 'Document': '#' is not a valid selector.
JS: 2026-06-28 09:40:00 [error X 2][https://kuchynehlinsko.cz/wp-includes/js/dist/vendor/react-dom.min.js?ver=18.3.1.1:198:64] Cannot read properties of undefined (reading 'rules')
JS: 2026-07-06 07:18:24 [error X 5][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/js/editor.min.js?ver=4.0.2:2:200704] Cannot read properties of undefined (reading 'route')
JS: 2026-07-06 07:29:45 [error X 8193][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/lib/pickr/pickr.min.js?ver=1.8.2:2:14799] Cannot read properties of null (reading 'clone')
JS: 2026-07-06 07:29:46 [error X 176][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/lib/pickr/pickr.min.js?ver=1.8.2:2:19552] Cannot read properties of null (reading 'changestop')
JS: 2026-07-06 10:26:18 [error X 5][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/js/editor.min.js?ver=4.0.2:2:246283] this.ui.input.val is not a function
JS: 2026-07-06 14:02:48 [error X 10][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/js/editor.min.js?ver=4.0.2:2:1063366] Cannot read properties of undefined (reading 'localized')
JS: 2026-07-11 15:54:53 [error X 8][https://kuchynehlinsko.cz/wp-content/plugins/elementor/assets/js/editor.min.js?ver=4.1.4:2:930509] Element type already registered

PHP: showing 8 of 8PHP: 2026-06-13 13:08:07 [warning X 3][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/ai/connect/ai.php::794] Undefined array key "mega-menu" [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2026-06-28 11:39:07 [notice X 53][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/includes/base/controls-stack.php::230] hexdec(): Passing null to parameter #1 ($hex_string) of type string is deprecated [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2026-07-01 08:49:45 [warning X 1][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/history/revisions-manager.php::363] Undefined array key "editor_post_id" [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2026-07-02 11:13:51 [warning X 2][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor-pro/modules/assets-manager/asset-types/icons/custom-icons.php::199] unlink(ChatGPT-Image-2.-7.-2026-11_13_14.png): No such file or directory [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2026-07-02 11:21:37 [warning X 1][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor-pro/modules/assets-manager/asset-types/icons/custom-icons.php::199] unlink(ChatGPT-Image-2.-7.-2026-11_21_10.png): No such file or directory [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2026-07-02 11:25:14 [warning X 1][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor-pro/modules/assets-manager/asset-types/icons/custom-icons.php::199] unlink(kuchyne_ikona.svg): No such file or directory [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2026-07-06 12:32:04 [error X 12][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/cloud-library/module.php::190] Uncaught WpOrg\Requests\Exception\Http\Status403: 403 Forbidden in /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/cloud-library/module.php:190
Stack trace:
#0 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/cloud-library/module.php(55): Elementor\Modules\CloudLibrary\Module->is_screenshot_proxy_mode(Array)
#1 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/core/base/module.php(86): Elementor\Modules\CloudLibrary\Module->__construct()
#2 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/core/modules-manager.php(64): Elementor\Core\Base\Module::instance()
#3 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/includes/plugin.php(704): Elementor\Core\Modules_Manager->__construct()
#4 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/includes/plugin.php(622): Elementor\Plugin->init_components()
#5 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-includes/class-wp-hook.php(341): Elementor\Plugin->init('')
#6 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-includes/class-wp-hook.php(365): WP_Hook->apply_filters(NULL, Array)
#7 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-includes/plugin.php(522): WP_Hook->do_action(Array)
#8 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-settings.php(771): do_action('init')
#9 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-config.php(102): require_once('/data/web/virtu...')
#10 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-load.php(50): require_once('/data/web/virtu...')
#11 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-blog-header.php(13): require_once('/data/web/virtu...')
#12 /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/index.php(17): require('/data/web/virtu...')
#13 {main}
thrown [array (
'trace' => '
#0: Elementor\Core\Logger\Manager -> shutdown()
',
)]
PHP: 2026-07-06 13:46:30 [warning X 5][/data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/wp-rest/classes/post-query.php::221] Undefined array key "included_types" [array (
'trace' => '
#0: /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/wp-rest/classes/post-query.php(221): Elementor\Core\Logger\Manager -> rest_error_handler()
#1: /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/wp-rest/classes/post-query.php(63): Elementor\Modules\WpRest\Classes\Post_Query -> get_post_types_from_params()
#2: /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/wp-rest/base/query.php(49): Elementor\Modules\WpRest\Classes\Post_Query -> get()
#3: /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/wp-rest/base/query.php(115): Elementor\Modules\WpRest\Base\Query -> Elementor\Modules\WpRest\Base\{closure}()
#4: /data/web/virtuals/396228/virtual/www/domains/kuchynehlinsko.cz/wp-content/plugins/elementor/modules/wp-rest/base/query.php(49): Elementor\Modules\WpRest\Base\Query -> send()
',
)]

Log: showing 5 of 52026-07-11 17:53:08 [info] Elementor data updater process has been queued. [array (
'plugin' => 'Elementor',
'from' => '4.0.2',
'to' => '4.1.4',
)]
2026-07-11 17:53:24 [info] elementor::elementor_updater Started
2026-07-11 17:53:24 [info] Elementor/Upgrades - _on_each_version Start
2026-07-11 17:53:24 [info] Elementor/Upgrades - _on_each_version Finished
2026-07-11 17:53:24 [info] Elementor data updater process has been completed. [array (
'plugin' => 'Elementor',
'from' => '4.0.2',
'to' => '4.1.4',
)]

== Elementor - Compatibility Tag ==

Elementor Pro: Není specifikována kompatibilita
Ultimate Addons for Elementor (UAE): Není specifikována kompatibilita

== Elementor Pro - Compatibility Tag ==
```

### Agreement

- [x] I confirm I have read and followed all the guidelines and instructions outlined in the Elementor Bug Report form.
- [x] I agree that my issue may be closed without further action if it doesn't meet all the requirements outlined in the Elementor Bug Report form.

Contributor guide

Open the contributing guide

Research direction

Start with the Atomic Form submit-button styling and inspect the generated /wp-content/uploads/elementor/css/base-desktop.css for the .e-form-submit-button-base:hover and :focus-visible rules. Reproduce with a custom background such as #E9C267, then verify that the hover state inherits or can be configured and no longer forces #323232.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, php
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.