useTheme

Konsta UI comes with handy useTheme hook to detect currently active theme (ios or material) set by App component or KonstaProvider.

<!-- App.svelte -->
<script>
  import { App } from 'konsta/svelte';
  import HomePage from './path/to/HomePage.svelte';
</script>

<!-- set theme on App component -->
<App theme="ios">
  <HomePage />
</App>

<!-- HomePage.svelte -->
<script>
  import { useTheme, Page } from 'konsta/svelte';

  const theme = $derived(useTheme());

  console.log(theme); // -> 'ios'
</script>

<Page>
  <p>Theme is {theme === 'ios' ? 'iOS' : 'Material'}</p>
</Page>