Is it possible to access Discourse theme color variables in my own theme component? I’m trying to use variables like --secondary in my CSS and it doesn’t seem to be working.

Yes, you should be able to access core’s native-css variables from a theme or theme component :+1: e.g. body { background-color: var(--secondary); } Could you share an example that’s not working?

I have trouble like this all the time. Sure, it’s “obvious” to use var, but only if you know and can remember! i’m waiting for something to run, so out of curiosity I checked https://ask.discourse.com/ and asked “Is it possible to access Discourse theme color variables in my own theme component?” and lo! I got this: Available Color Variables: Discourse provides several predefined CSS custom properties for colors, such as: var(--primary) var(--secondary) var(--tertiary) var(--quaternary) var(--header_background) var(--header_primary) var(--highlight) var(--danger) var(--success) var(--love) Example Usage: You can use these variables in your CSS to ensure your theme adapts to different user-selected color schemes. For instance: body { background: var(--highlight); }

הפנייה למשתני צבע נושא Discourse ברכיב נושא מותאם אישית?

תמיכה

jordan-violet (Jordan Violet) 21 במרץ,‏ 2025,‏ 4:16pm 4

אה! לא הייתי משתמש ב־var()

נושא		תגובות	צפיות
Use Discourse Core Variables in your Theme Developer Guides how-to , theme-guides	0	12423	9 בינואר,‏ 2018
Custom CSS isn't applied to my Discourse Product Support	17	3242	5 בפברואר,‏ 2021
How do colors work and how to change them? Product Support ux	4	426	20 במרץ,‏ 2025
Discourse-fully light/dark下不同的颜色变量如何设置并生效 Product Support	1	209	22 בספטמבר,‏ 2025
Styling Discourse with variables: Show & Tell Development dev-news	1	411	5 באוגוסט,‏ 2025

הפנייה למשתני צבע נושא Discourse ברכיב נושא מותאם אישית?

נושאים קשורים