Buttons in the Duda System: Design

15 August 2022

Welcome to Part 2 of our 2-part series on buttons in the Duda system! In this tutorial, we’ll cover button design. In our last video, we explored button content and linking – you can catch that video here.


Dive in as we cover four primary aspects of button design in Duda:


  • Layout
  • Sizing
  • Color
  • Positioning

Button Layout

1. Right click on your button and select “Edit Design” to open the button editor popup.

2. Click on the right arrow beneath “Layout” to pull up the Duda preset button shapes. Hovering over each option shows how the button will look in its hover state. Select the shape you want, and “X” out of the button shapes pop-up.

Button Sizing

3. Scroll down on your “Button Design” editor to adjust the width and height of your button. Alternatively, you can manually adjust the button’s size within the website editor itself, but we recommend using the width and height adjustments in the design editor to guarantee consistency across the entire site.

Button Color

4. Scroll down further on your “Button Design” editor to view and edit the background color and border weight of your button. Click “More design options” to view and edit hover state options.


5. To change your button text color, scroll up and toggle from “Button Style” to “Button Text.”

6. If you determine that you do not like your button changes, you can click the “Revert to global design” button, and the button will revert back to the global design preset you have in Duda.

Button Positioning

7. Toggle the “Floating” selector On to make a “sticky” button. This means that your button will stay in that screen position no matter where you scroll. 


8. Use the “Position” selector to choose where you button will reside.



9. Next, toggle “Show on this page only” On if you would like the button to reside on the current page only. Keep this Off if you want the button to float on every page.

Are You Interested in More Duda Tutorials?

Stay tuned for Part 2 of our series on buttons in the Duda system where we discuss how to style your buttons! For more Duda tutorials, head over to our YouTube channel or browse the RivalMind resource library.

Meet the Author

Harley Helmer

Lead Search Marketing Strategist 

Harley Helmer is a digital marketing professional with nearly a decade of experience in the industry. Today, he's the head of search marketing strategy at RivalMind, responsible for developing and executing comprehensive SEO campaigns that improve online visibility and boost organic traffic. His pragmatic, no-nonsense approach to marketing – paired with a robust knowledge base – helps him deliver innovative solutions to technical challenges and deliver real client success.

Specialties: SEO Gold Mine, Idea Guy

Looking for more organic website traffic?


Welcome to RivalMind. Our purpose is to help your business thrive. We are a digital marketing agency that offers SEO, PPC, Web Design, Social Media and Video Solutions as tools to our clients for online business development and growth.


Contact us today to get started!

Blog Contact Form

Connect with Us:

Not all devs are equal : how to choose the right duda partner
by Jessica Goodrum 2 June 2025
Before comparing agencies, it’s important to understand the why behind the platform itself. Duda is not just another website builder. It is engineered for speed, reliability, and scalability, especially in agency and B2B environments. With built-in hosting, security, and responsive web design tools, Duda supports both creative expression and operational efficiency. That is why many top website designers have made it a core part of their development ecosystem.
A blog thumbnail for animating vision : how rivalmind brings stories to life on social media
by Jessica Goodrum 21 May 2025
Human beings are wired to create. Imagination isn’t just a tool; it’s a reflection of our inner world. That’s why animation resonates so deeply with us. Even the simplest animated post has the power to spark emotion, tell a story, and forge connection. At RivalMind, we’ve seen how animation can bridge the gap between a brand’s vision and its story. It brings static ideas to life in ways that feel fresh, engaging, and aligned with today’s fast-moving digital landscape. As our clients' needs for social media and web-based animations grew, we recognized it was time to evolve our approach. Previously, we relied on Adobe Illustrator and After Effects to create custom animations. While these tools produced quality results, the time and effort required made it difficult to offer motion design as a scalable, accessible solution. We asked ourselves a simple question, "How can we create high-quality animations efficiently, without compromising creativity?"
A woman in a pink shirt is standing in front of a laptop computer.
by Jessica Goodrum 16 May 2025
Discover how visual content drives SEO performance, boosts engagement, strengthens brand trust, and how RivalMind crafts visuals that convert.
Show More →