Customizing the look of Hudu

In order to change the CSS, you will need to go to Admin -> Design -> and then enter styles in the Custom CSS Field.

When choosing colors to style your Hudu with, we typically recommend using a service like: https://coolors.co/. This gives you a neat way to match palettes and create a aesthetically-pleasing color scheme.

Some common requests we have gotten from clients:

Changing header color

Dark theme

.header { background: #000; }

Light theme

.header { background: white; } a.header__a { color: #5b17f2; } a.header__a:hover { background: #5b17f2; } 

Changing background color

body { background: #EEE; }

Changing buttons

.button--primary, .form input[type=submit] {
  border: 1px red solid !important;
  background-color: red !important;
  background: red !important;
  color: white;
}

Rounding corners

.header { background: white; }

a.header__a { color: #5b17f2; }

a.header__a:hover { background: #5b17f2; }

.dash__item { border-radius: 8px;} .header__a { border-radius: 0 40px 40px 0;}

Have a theme you want to share? Let us know!