GitHub user dosubot[bot] added a comment to the discussion: Facing issues with 
superset theme after ui overhaul

<!-- Answer -->
You can see the default theme tokens and their hex values in Superset’s source 
code. The main color tokens are defined in the Theme class 
([Theme.tsx](https://github.com/apache/superset/blob/master/superset-frontend/packages/superset-ui-core/src/theme/Theme.tsx)),
 for example:

- `colorPrimary`: `#2893B3`
- `colorLink`: `#2893B3`
- `colorError`: `#e04355`
- `colorWarning`: `#fcc700`
- `colorSuccess`: `#5ac189`
- `colorInfo`: `#66bcfe`

Font families, logo properties, and other style tokens are also set there. For 
a full list of allowed tokens (including all Ant Design v5 tokens Superset 
supports), check 
[types.ts](https://github.com/apache/superset/blob/master/superset-frontend/packages/superset-ui-core/src/theme/types.ts)—this
 file lists every token key you can use, though not their values.

For more examples, 
[exampleThemes.ts](https://github.com/apache/superset/blob/master/superset-frontend/packages/superset-ui-core/src/theme/exampleThemes.ts)
 shows sample theme configs with hex values for custom themes.

If you want to access these tokens programmatically in your React components, 
use the `useTheme` hook or the `supersetTheme` object from `@superset-ui/core`. 
This lets your components always use the current theme’s values and adapt to 
theme changes automatically.

Let me know if you want a JSON dump of the default color tokens!


<!-- Dosu Comment Footer -->
*To reply, just mention [@dosu](https://go.dosu.dev/dosubot).*

---
<sup>How did I do? 
[Good](https://app.dosu.dev/response-feedback/37129118-2129-4c05-993c-0c95e1daa9f5?feedback_type=great_response)
 | 
[Irrelevant](https://app.dosu.dev/response-feedback/37129118-2129-4c05-993c-0c95e1daa9f5?feedback_type=irrelevant_answer)
 | 
[Incorrect](https://app.dosu.dev/response-feedback/37129118-2129-4c05-993c-0c95e1daa9f5?feedback_type=incorrect_sources)
 | 
[Verbose](https://app.dosu.dev/response-feedback/37129118-2129-4c05-993c-0c95e1daa9f5?feedback_type=too_verbose)
 | 
[Hallucination](https://app.dosu.dev/response-feedback/37129118-2129-4c05-993c-0c95e1daa9f5?feedback_type=hallucination)
 | [Report 
🐛](https://app.dosu.dev/response-feedback/37129118-2129-4c05-993c-0c95e1daa9f5?feedback_type=bug_report)
 | 
[Other](https://app.dosu.dev/response-feedback/37129118-2129-4c05-993c-0c95e1daa9f5?feedback_type=other)</sup>

[![Chat with 
Dosu](https://dosu.dev/dosu-chat-badge.svg)](https://app.dosu.dev/a28d3c7e-a9d3-459e-9fb6-3a6f9ff4f357/ask?utm_source=github)&nbsp;[![Open
 in 
Cursor](https://dosu.dev/dosu-in-cursor.svg)](https://cursor.com/link/prompt?text=You%20can%20see%20the%20default%20theme%20tokens%20and%20their%20hex%20values%20in%20Superset%E2%80%99s%20source%20code.%20The%20main%20color%20tokens%20are%20defined%20in%20the%20Theme%20class%20%28%5BTheme.tsx%5D%28https%3A//github.com/apache/superset/blob/master/superset-frontend/packages/superset-ui-core/src/theme/Theme.tsx%29%29%2C%20for%20example%3A%0A%0A-%20%60colorPrimary%60%3A%20%60%232893B3%60%0A-%20%60colorLink%60%3A%20%60%232893B3%60%0A-%20%60colorError%60%3A%20%60%23e04355%60%0A-%20%60colorWarning%60%3A%20%60%23fcc700%60%0A-%20%60colorSuccess%60%3A%20%60%235ac189%60%0A-%20%60colorInfo%60%3A%20%60%2366bcfe%60%0A%0AFont%20families%2C%20logo%20properties%2C%20and%20other%20style%20tokens%20are%20also%20set%20there.%20For%20a%20full%20list%20
 
of%20allowed%20tokens%20%28including%20all%20Ant%20Design%20v5%20tokens%20Superset%20supports%29%2C%20check%20%5Btypes.ts%5D%28https%3A//github.com/apache/superset/blob/master/superset-frontend/packages/superset-ui-core/src/theme/types.ts%29%E2%80%94this%20file%20lists%20every%20token%20key%20you%20can%20use%2C%20though%20not%20their%20values.%0A%0AFor%20more%20examples%2C%20%5BexampleThemes.ts%5D%28https%3A//github.com/apache/superset/blob/master/superset-frontend/packages/superset-ui-core/src/theme/exampleThemes.ts%29%20shows%20sample%20theme%20configs%20with%20hex%20values%20for%20custom%20themes.%0A%0AIf%20you%20want%20to%20access%20these%20tokens%20programmatically%20in%20your%20React%20components%2C%20use%20the%20%60useTheme%60%20hook%20or%20the%20%60supersetTheme%60%20object%20from%20%60%40superset-ui/core%60.%20This%20lets%20your%20components%20always%20use%20the%20current%20theme%E2%80%99s%20values%20and%20adapt%20to%20theme%20changes%20automatically.%0A%0ALet%20me%20know%2
 
0if%20you%20want%20a%20JSON%20dump%20of%20the%20default%20color%20tokens%21)&nbsp;[![Join
 
Discord](https://img.shields.io/badge/join-5865F2?logo=discord&logoColor=white&label=)](https://go.dosu.dev/discord-bot)&nbsp;[![Share
 on 
X](https://img.shields.io/badge/X-share-black)](https://twitter.com/intent/tweet?text=%40dosu_ai%20helped%20me%20solve%20this%20issue!&url=https%3A//github.com/apache/superset/discussions/37889)

GitHub link: 
https://github.com/apache/superset/discussions/37889#discussioncomment-15767883

----
This is an automatically sent email for [email protected].
To unsubscribe, please send an email to: 
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to