Colour Scheme for custom HTML

Just to add to this - you can access the colors in python using

from anvil import app

primary_500 = app.theme_colors["Primary 500"]

Depending on how you want to access the colors, you could also create css vars in your theme.css

/* theme.css */
:root {
    --primary-500: %color:Primary 500%;
    --primary-700: %color:Primary 700%;
    --secondary-500: %color:Secondary 500%;
    --secondary-700: %color:Secondary 700%;
}


And reference these vars in the custom html

<style>
.some-class {
    color: var(--pramary-500);
}
</style>

linked topic

Change Theme Colour Scheme values Programmatically - #2

3 Likes