Component

AppearanceCard

Theme toggle card used on profile pages. Switches between light and dark mode.

Interactive

live editor — edit to update preview

function Demo() {
  const [theme, setTheme] = useState("light");
  return (
    <AppearanceCard
      theme={theme}
      onThemeChange={setTheme}
    />
  );
}
render(<Demo />);

Props

Prop	Type	Default	Description
theme*	string	—	Current theme value — "light" or "dark".
onThemeChange*	(t: "light" \| "dark") => void	—	Called when the user selects a theme.