With this element, you can add a colorful rainbow drop-shadow effect to your button, making it more vibrant and visually attractive. The bright shadow effect helps important buttons stand out and grab the user’s attention. It’s a great way to enhance call-to-action buttons while adding a creative and modern touch to your website design.
Required Setup
- Bricks Builder installed & activated.
- You need to have the WDesignKit plugin installed and activated.
- Make sure you’ve created an account and logged into it.
- Make sure you’ve downloaded the Rainbow Button element.
How to Activate the Rainbow Button Element?
Go to
- WDesignKit → Widgets → Browse Widgets.
- Search the element name and select Bricks as the Page Builder.
- Click on the Download icon.
Use Cases
Use the Rainbow Button element when you want to highlight important call-to-action buttons with a colorful rainbow drop-shadow effect. It helps make buttons more visually appealing and noticeable, encouraging users to interact with them. The vibrant shadow adds a creative and modern touch while keeping the button clear and easy to use.
Best For:
- Call-to-Action Sections: Highlight important actions like “Get Started,” “Sign Up,” or “Learn More” with a vibrant button that instantly grabs user attention.
- Landing Pages: Use rainbow buttons to guide visitors toward key actions such as purchasing a product, registering for a service, or exploring more content.
- Promotional & Marketing Pages: Emphasize special offers, discounts, or campaign actions with eye-catching buttons like “Claim Offer” or “Shop Now.”
- Creative & Portfolio Websites: Add colorful buttons for actions such as “View Project,” “Explore Work,” or “See Portfolio.”
- Event & Webinar Pages: Encourage user interaction with visually engaging buttons like “Register Now” or “Join the Event.”
- E-commerce Websites: Highlight important shopping actions such as “Buy Now,” “Add to Cart,” or “View Product.”
- Startup & SaaS Websites: Promote product trials or demos with vibrant buttons like “Start Free Trial” or “Request Demo.”
- Mobile-Friendly Interfaces: Perfect for modern websites where visually distinct buttons improve usability and encourage user interaction.
- Modern UI Designs: Ideal for websites that want a bold, colorful, and engaging interface while making key actions easy to notice.
How to Use the Rainbow Button Element in Bricks?
Add the Rainbow Button element to the page.
CONTENT
In the Button Text section, you can add text to the button.
Then, in the URL section, you can add the button URL.
By enabling the Open in new tab toggle, the attached URL will open in a new browser tab.
You can add an icon or SVG to the button from the Select Icon section.
EXTRA OPTIONS
Then, from the Alignment section, you can align the button for responsive devices.
Then, from the Style tab, you can further customize the style of the Rainbow Button.