Profile And Notification Cards

A settings page block with a profile card for editing display name, email, and visibility, plus a notifications card of toggle switches, saved with a toast confirmation.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Profile And Notification Cards to your project and fits it to your theme.

import SettingsBlock from "@/components/ui/settings-1";

export default function SettingsBlockDemo() {
  return <SettingsBlock />;
}