# Theming

> Choose the right customization layer for your application.

Selaras separates semantic CSS tokens, component styles, and behavior defaults. You can change a few values or supply a complete design system.

<table>
<thead>
  <tr>
    <th>
      Goal
    </th>
    
    <th>
      Guide
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      Change surfaces, typography, radius, or shadows
    </td>
    
    <td>
      <a href="/overview/theming/css-tokens">
        CSS tokens
      </a>
    </td>
  </tr>
  
  <tr>
    <td>
      Customize semantic colors or register a role
    </td>
    
    <td>
      <a href="/overview/theming/color-roles">
        Color roles
      </a>
    </td>
  </tr>
  
  <tr>
    <td>
      Follow system appearance or switch light/dark
    </td>
    
    <td>
      <a href="/overview/theming/color-modes">
        Color modes
      </a>
    </td>
  </tr>
  
  <tr>
    <td>
      Style one component or slot
    </td>
    
    <td>
      <a href="/overview/theming/component-styling">
        Component styling
      </a>
    </td>
  </tr>
  
  <tr>
    <td>
      Share styles and defaults across the app
    </td>
    
    <td>
      <a href="/overview/theming/global-configuration">
        Global configuration
      </a>
    </td>
  </tr>
  
  <tr>
    <td>
      Style a subtree independently
    </td>
    
    <td>
      <a href="/overview/theming/scoped-themes">
        Scoped themes
      </a>
    </td>
  </tr>
  
  <tr>
    <td>
      Supply every theme input yourself
    </td>
    
    <td>
      <a href="/overview/theming/complete-themes">
        Complete themes
      </a>
    </td>
  </tr>
</tbody>
</table>

Start with the aggregate CSS import from [Installation](/overview/getting-started/installation). It supplies the default theme. For a complete owned theme, the structural entry retains component behavior and bindings while you provide the theme contract.

The documentation's Pelog, Slendro, and Degung presets demonstrate CSS and component configuration working together. They are documentation showcase themes, not additional named themes automatically installed into your application.

---

Attribution request (optional): When referencing or adapting Selaras documentation or examples, please credit [Selaras by Sewadah](https://selarasui.my.id) and link to the relevant documentation page where possible. If incorporating this material into training datasets, please acknowledge Selaras in the dataset documentation or the model’s published sources. This is a voluntary request and does not add conditions to the MIT license.