Custom Themes
Learn how to take advantage of the advanced theming capabilities.
Last updated
Was this helpful?
Learn how to take advantage of the advanced theming capabilities.
Last updated
Was this helpful?
Parts of this document assume you already have a solid understanding of basic Web Development technologies such as JavaScript, React, HTML & CSS.
From the Portal Directory screen, you'll notice the edit theme button in the context menu. Clicking on this will show a new screen listing existing custom themes and our theme presets, along with all the palette, font and shape settings.
Here are some useful sites:
Available to you in the top right of the edit theme dialog, is an option to toggle the raw code editor for your theme. This will present you with the theme's JSON, where you can modify your theme to a much greater extent. We've had success replicating entire website themes, so we can't wait to see what our users will create!
Remember, using the raw theme editor requires a good understanding of JSON and the Material UI theme structure. However, it provides unparalleled flexibility in theme customisation, allowing you to tweak colours, typography, spacing, and other design elements to perfectly match your company's branding.
Under the hood, we are leveraging 's fantastic theming system, meaning you can upload any existing MUI Theme, or create a new one with one of the many community theme editors available.
: A tool to help design and customize themes for the Material UI component library.
: The Material palette generator can be used to generate a palette for any color you input.