# SB-Themes Repository: Unifying Design Across Platforms

The SB-Themes repository serves as a standalone repository that plays a pivotal role in both the Sunbird-Ed portal and the Sunbird-Ed mobile application. It embodies a unified design philosophy that ensures a consistent visual identity across these platforms.

**Themes for Sunbird-Ed Portal:**

Within the portal, SB-Themes introduces two distinct themes, each with its corresponding dark mode version:

1. **Classical Theme:** This theme offers a timeless and conventional visual style, catering to users who prefer a classic aesthetic.
2. **Joyful Theme:** In contrast, the Joyful theme brings vibrancy and energy to the portal's design, creating a visually engaging and joyful user experience.

**Dynamic Theme Switching:**

The magic lies in the use of CSS3 variables, which enable dynamic theme switching. When transitioning from one theme to another, structural changes occur throughout the portal.

This includes adjustments to the layout, button styles, card designs, modals, select boxes, and more. These changes align seamlessly with the chosen theme, ensuring a cohesive and visually pleasing user interface.

**Consistency Across Platforms:**

The same design philosophy extends to the Sunbird-Ed mobile application, ensuring that users experience a harmonious and familiar visual environment regardless of the device they use.

In summary, SB-Themes offers a versatile and efficient approach to theming, enhancing the user experience by providing choices and maintaining design consistency across both the Sunbird-Ed portal and mobile application.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ed.sunbird.org/older-versions/contribute/source-code/workflows/ui-user-interface-sunbird-ed-portal/sb-themes-repository-unifying-design-across-platforms.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.