hint
Customize the Wagtail CMS admin theme
Rob Moorman
25 januari 2022
While building a lot of Wagtail platforms we often see the need of branding the admin theme, like displaying the name of client or replacing the logo.
Now Wagtail makes better use of CSS variables it becomes quite easy to change the primary (teal) color of the default Wagtail admin theme. With only this change the Wagtail platform integrates way better in the commonly applied brandguide of your client.
In order to achieve this we need to add a Wagtail hook which inserts some CSS rules:
@hooks.register("insert_global_admin_css") def insert_global_admin_css(): return mark_safe( '<style type="text/css">:root{--color-primary-hue:%s;--color-primary-saturation:%s%%;--color-primary-lightness:%s%%;}</style>' % (340, 100, 47) )
You can read more information about this customization in the documentation of Wagtail.