1. Customizations
  2. Global style

Elements you can customize

  • Primary color. Rownd’s default primary color is

    Purple #5B13DF. You can change this color to match your brand color.

  • Corner radiuses. By default, Rownd modal and hub corners have rounded edges; you can choose between rounded and square corners on UI elements.

  • Overlay blurring. By default, overlays (behind modals) blur the background. You can leave this on or turn it off.

  • Visual elements. Most Rownd dialogs include “visual swoops” at the bottom that match the primary color you select. You can choose to remove these for your application.

How to customize

  1. In the Rownd dashboard, navigate to the Design tab from the left navigation.

  2. Edit and change dark mode options, the primary color, corners, background blur, and visual elements with the options on the left side of the screen.

  3. Preview your changes in an example UI dialog on the right side of the screen.

  4. Press Save in the top-right corner before leaving the page. Your updates will be applied to the websites and apps where you’ve installed the Rownd code snippet.

If your app is already in production, you may want to create a second Rownd app in order to test your changes before applying them to your live environment.

You can use the Reset to default settings option on the right side of the page to reset the style to the Rownd defaults.