Color Picker for Elementor Forms lets you add a professional and customizable color selector to any Elementor Pro Form field.
Users can easily pick a color visually, type a color code manually, or select from predefined color options — perfect for product customization, design requests, or survey choices.
Dynamic color binding: When a user selects a color, you can automatically apply it to any element in your form or theme using a custom CSS selector (e.g: .elementor-button or #heading).
Let users select from a pre-defined set of swatches you make available or even let them choose a custom hex value from the color picker.
Features
- Works with Text, Radio, Checkbox or Select field types
- Support for color formats: HEX, RGB(A), HSL
- Optional Custom Color input for users to choose their own color.
- Predefined palette options.
- Dynamic color binding: apply the selected color to any element via a custom CSS selector (e.g: .elementor-button, #title).
- Live sync: input and color picker stay in sync dynamically.
- Fully responsive and customizable with CSS variables.
Perfect for
- Product customization (choose a color, theme, or paint)
- Design requests or branding forms
- Surveys or polls involving color preference
- Any form where users need to choose a color
This add-on is also available in the Elementor Forms Add-on Bundle – Save up to 90%
Related plugins
PDF for Elementor Forms + Drag And Drop Template Builder Pro
Generate PDF using Elementor Forms plugin provides an easier way to download PDF documents, and open the PDF document file after the successful form submission.
Image Picker – image choices for Elementor Forms Pro
Instead of boring dropdowns or checkboxes, you can display images as selectable options (Image Choices).
Input Masks for Elementor Forms Pro
Input Masks for Elementor Forms is an add-on plugin for Elementor Forms that enables you to apply input masks to form fields. Input masks guide users to enter data in the correct format, such as phone numbers, postal codes, credit card numbers, or other specific types of information. With an input mask, placeholder characters appear […]
Drag and Drop File Upload for Elementor Forms Pro
Elementor Forms – Drag and Drop Multi File allows users to upload multiple files using your web form’s popular drag and drop or file browsing feature.
Donna Gomez (store manager) –
We use Elementor Forms for clients to submit custom merchandise requests, and they needed a way to pick exact brand colors. This plugin adds a beautiful, native color picker field right inside the Elementor Form widget. Users can visually select a color or type in HEX, RGBA, or HSLA codes. The color data maps perfectly into our email entries. Essential tool for custom-order sites!