ram0ng1 I think the easiest is to apply inline CSS to the elements you want to change the color of, like the Tags extension does.
So first you need to identify which Flarum components you need to extend and how to manually apply an element.attrs.style.backgroundColor attribute to the correct Mithril child.
Then if the Component has a reference to the active tag, you can read the tag color from there. Or if it's not available (from the header for example), you can fetch the active tag from the url via the same logic as the tags extension on the homepage.
So a solution to fetch the active tag's color from about any component (based on the url):
const slug = m.route.param('tags')
if (slug) {
const tag = app.store.getBy('tags', 'slug', slug);
if (tag) {
const color = tag.color();
if (color) {
somethingThatDependsOnWhatIsExtended.style = {backgroundColor: color};
}
}
}
This should work on the discussion list. To also apply the colors when visiting a discussion page based on the discussion's tags will require another logic to access the discussion's tags.