https://github.com/draganaleksic99/ai-toggle-mode
Demo of Vercel AI SDK to control UI via side effects. Set light/dark/system mode by typing the mode you want, e.g. `dark mode`, in the chat. Type `clear` to delete messages from the chat.
https://github.com/draganaleksic99/ai-toggle-mode
generative-ai nextjs shadcn-ui tailwindcss typescript vercel-ai-sdk
Last synced: 4 months ago
JSON representation
Demo of Vercel AI SDK to control UI via side effects. Set light/dark/system mode by typing the mode you want, e.g. `dark mode`, in the chat. Type `clear` to delete messages from the chat.
- Host: GitHub
- URL: https://github.com/draganaleksic99/ai-toggle-mode
- Owner: DraganAleksic99
- Created: 2024-06-23T01:13:13.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2024-11-26T18:56:04.000Z (11 months ago)
- Last Synced: 2025-06-24T14:59:07.287Z (4 months ago)
- Topics: generative-ai, nextjs, shadcn-ui, tailwindcss, typescript, vercel-ai-sdk
- Language: TypeScript
- Homepage: https://dub.sh/ai-toggle-mode
- Size: 549 KB
- Stars: 6
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ai-toggle-mode
Demo of [Vercel AI SDK](https://sdk.vercel.ai/docs/introduction) to control UI via side effects. Set light/dark/system mode by typing the mode you want, e.g. `dark mode`, in the chat. Type `clear` to delete messages from the chat.
https://github.com/user-attachments/assets/1be1a7ce-9def-4971-83bf-b25b82e9d4bc
> Prompting an llm to set dark or light theme and clear messages
## Quickstart
### 1. Clone this repository
Run the following command to clone the repo:
```
https://github.com/DraganAleksic99/ai-toggle-mode.git
```
### 2. Install dependencies
```
cd ai-toggle-mode
npm i
```
### 3. Fill out secrets
```
cp .env.local.example .env.local
```
### 4. Run app locally
```
npm run dev
```
### Open in your browser
You can now visit http://localhost:3000.