✨ VibeLayer: Your Adorable Desktop Companion! 🐾

Let your desktop vibe with you!

VibeLayer is not just another app - it's your adorable, always-on-top, see-through sticker buddy! Overlay cute, quirky, or motivational stickers (with transparent backgrounds!) right on your desktop. Make your workspace fun, personal, and a little bit magical. ✨

---

🎉 What Makes VibeLayer Awesome?

• 🖼️ Transparent Stickers: Place stickers anywhere on your screen. They float above your work, always on top, always adorable.
• 🌐 Import from Anywhere:
  • Local files: Drag, drop, or select images from your computer.
  • Direct URLs: Paste any image link and boom - sticker!
  • Online Search: Find GIFs from Giphy or images from Unsplash, right inside the app.
• 🪄 Magic Background Removal: One click and your sticker's background vanishes (thanks, Imgly AI!).
• 🦄 Layout Freedom: Drag, resize, and position stickers wherever you want. Your layout is saved - VibeLayer remembers your style.
• 🗂️ Sticker Management: Delete, and organize your sticker collection. Marie Kondo would be proud.
• ⚙️ Quirky Settings:
  • Always-on-top toggle (stickers never hide!)
  • Start with your computer (auto-launch)
  • Hide sticker capture (for secret vibes)
  • Dark & light themes (for every mood)
• 🔒 Privacy First: Stickers and settings are stored locally. No cloud, no snooping.
• 💻 Cross-Platform: Windows, macOS, Linux - everyone gets to vibe!

🖼️ Screenshots

Yet to come

🚀 Getting Started

Recommended IDE Setup

• VSCode + ESLint + Prettier

Installation

npm install

Development

npm run dev

Build

# For Windows
yarn build:win
# For macOS
yarn build:mac
# For Linux
yarn build:linux

🦊 How to Use Your New Desktop Buddy

1. Import Stickers

• Local File: Drag and drop or click to select images.
• URL: Paste any direct image link (PNG, GIF, etc.).
• Online Search: Search for GIFs (Giphy) or images (Unsplash) and import with a click.

2. Manage Your Collection

• Set as Active: Click "Set" to float a sticker on your desktop.
• Remove Background: Click "Remove BG" for instant transparency.
• Delete: Keep your sticker family organized.

3. Layout & Positioning

• Drag and resize stickers in the "Layout" tab.
• Layouts are saved - your desktop stays just how you like it.

4. Settings for Every Mood

• Always on Top: Stickers never hide, even when you're busy.
• Start on Boot: VibeLayer wakes up with your computer.
• Hide Sticker Capture: For when you want your stickers to be extra private.
• Theme: Dark or light - pick your vibe.

🛠️ Tech Stack (a.k.a. The Secret Sauce)

• Electron: Desktop wizardry
• React: Snappy UI
• Vite: Lightning-fast builds
• Tailwind CSS: Pretty pixels
• Giphy & Unsplash APIs: Infinite sticker possibilities
• Imgly Background Removal: AI magic for transparency
• Electron Store: Remembers your stickers and settings
• Auto-launch: For the always-there vibe

🧙‍♂️ Configuration & Environment

• Set your API keys for Giphy and Unsplash in environment variables:
  • VITE_GIPHY_API_KEY
  • VITE_UNSPLASH_ACCESS_KEY
• Stickers and settings are stored locally in your user data directory.

---

🤝 Contributing

1. Fork the repo and create your branch.
2. Run npm install and npm run dev.
3. Submit a pull request with a fun description!

---

🌟 Credits

• Giphy
• Unsplash
• Imgly Background Removal
• Electron
• React

---

VibeLayer - Because your desktop deserves a little personality!