An open API service indexing awesome lists of open source software.

https://github.com/yawningface/notion-widgets

Free notion widgets
https://github.com/yawningface/notion-widgets

chronometer day-of-the-year deadline-countdown lofi notion notion-pomodoro notion-widgets pomodoro react vite widgets

Last synced: about 2 months ago
JSON representation

Free notion widgets

Awesome Lists containing this project

README

          

# Notion Widgets by YawningFace

**Simple, Minimal, Notion-Ready Components**

🌐 **Live Demo:** [Notion Widgets by YawningFace](https://notion.yawningface.org)
💻 **Notion Widgets GitHub repo:** [notion-widgets on GitHub](https://github.com/Yawningface/notion-widgets)
🔗 **Yawningface Website:** [YawningFace](https://yawningface.org)
💻 **Yawningface GitHub:** [YawningFace on GitHub](https://github.com/Yawningface)

Notion Widgets by YawningFace provides a collection of lightweight and aesthetically pleasing widgets that integrate seamlessly with Notion. Enhance your productivity, track your time, and stay motivated with these simple tools.

## Widgets Included

### 🎯 Pomodoro
Stay focused with the **Pomodoro technique**. Work in timed intervals with short breaks to maximize productivity.

### 📅 Day Counter
Find out **what day of the year** it is today with a simple, visual counter.

### ⏱️ Chronometer
A **basic stopwatch** to track elapsed time efficiently.

### ⏳ Deadline Countdown
Keep an eye on your deadlines with a **real-time countdown** displaying the time remaining until your important due dates.

### 🎶 Lofi Music Player
Stay in the zone with a **minimalist lofi music player**, perfect for background focus music.

## How to Use

1. **Embed in Notion**
- Copy the URL of a widget (for example: https://notion.yawningface.org/pomodoro)
- Open your Notion page
- Paste the URL and select **"Create Embed"**

2. **Customize**
Some widgets, like the deadline countdown widget have adjustable settings for a personalized experience. Adjust the settings, and copy the unique link you will get and use it like in (1.)

## Installation (For Local Development)

If you want to modify or self-host these widgets, follow these steps:

### First-Time Setup
```sh
npm install
```

### Launch the Project
```sh
npm run dev
```

### Deploy on Vercel
To deploy on Vercel, run:
```sh
vercel --prod
```
*Note: You’ll need the Vercel CLI installed and an active Vercel account login.*

## Contributing

Contributions are welcome! Feel free to submit **issues** or **pull requests** to improve the widgets.

## License

This project is licensed under the **MIT License**.