Skip to content

Repository files navigation

Dynamic Island

Anime-Themed Dynamic Island for Desktop

The sleekest desktop widget you've never had -- inspired by Apple's Dynamic Island, powered by Rust, themed in anime aesthetics.

License: MIT Tauri Svelte Rust Platform Stars


A floating, always-on-top pill widget that brings iOS Dynamic Island to your Linux/Windows desktop β€” with anime sparkles, neon glows, and glassmorphism.



Features

Media Control

  • Now Playing β€” song title, artist, album art with spinning animation
  • Play/pause, skip, previous controls
  • Progress bar with neon gradient
  • Supports Spotify, VLC, and any MPRIS-compatible player (Linux)

System Monitor

  • Real-time CPU & RAM usage with anime-styled progress rings
  • Battery level with cute charging animation
  • Network speed (upload/download)
  • Disk usage overview

Weather

  • Current temperature & conditions
  • Feels like, humidity, wind speed
  • Animated weather effects (rain, snow, sun rays)
  • Auto-location or manual coordinates

Notifications

  • System notification aggregation
  • Slide-in notification cards
  • Do Not Disturb mode with moon icon toggle
  • Dismiss with poof animation

Timer & Stopwatch

  • Countdown timer with neon digits
  • Pomodoro presets (25/5/15 min)
  • Stopwatch with lap tracking
  • Subtle pulse animation while running

Clipboard History

  • Last 50 clipboard entries
  • Click to re-copy
  • Clear history

Anime Theme

  • Deep purple + neon pink + cyan color palette
  • Glassmorphism frosted glass effect
  • Floating particle sparkles (sakura, stars)
  • Neon glow borders that pulse
  • Spring physics animations
  • Kawaii-inspired icons and design

Quick Start

Prerequisites

  • Node.js 18+
  • Rust 1.70+
  • pnpm 8+
  • Linux: webkit2gtk and librsvg libraries
  • Windows: WebView2 (usually pre-installed)

Linux Dependencies

Ubuntu/Debian

sudo apt install libwebkit2gtk-4.1-dev librsvg2-dev patchelf

Fedora

sudo dnf install webkit2gtk4.1-devel librsvg2-devel

Arch

sudo pacman -S webkit2gtk-4.1 librsvg

Install & Run

# Clone the repository
git clone https://github.com/thanvish21/dynamic-island.git
cd dynamic-island

# Install dependencies
pnpm install

# Run in development mode
pnpm tauri dev

# Build for production
pnpm tauri build

Architecture

dynamic-island/
β”œβ”€β”€ src/                    # Svelte 5 Frontend
β”‚   β”œβ”€β”€ lib/
β”‚   β”‚   β”œβ”€β”€ components/     # UI Widgets
β”‚   β”‚   β”‚   β”œβ”€β”€ Island.svelte          # Main container
β”‚   β”‚   β”‚   β”œβ”€β”€ MediaWidget.svelte     # Now Playing
β”‚   β”‚   β”‚   β”œβ”€β”€ SystemWidget.svelte    # CPU/RAM/Battery
β”‚   β”‚   β”‚   β”œβ”€β”€ WeatherWidget.svelte   # Weather display
β”‚   β”‚   β”‚   β”œβ”€β”€ NotificationWidget.svelte
β”‚   β”‚   β”‚   β”œβ”€β”€ TimerWidget.svelte     # Timer/Stopwatch
β”‚   β”‚   β”‚   β”œβ”€β”€ ClipboardWidget.svelte # Clipboard history
β”‚   β”‚   β”‚   └── Particles.svelte       # Anime particles
β”‚   β”‚   β”œβ”€β”€ stores/         # Svelte stores
β”‚   β”‚   └── utils/          # Utilities
β”‚   └── routes/             # SvelteKit pages
β”œβ”€β”€ src-tauri/              # Rust Backend
β”‚   └── src/
β”‚       β”œβ”€β”€ lib.rs          # Tauri app builder
β”‚       β”œβ”€β”€ system.rs       # System monitoring
β”‚       β”œβ”€β”€ media.rs        # Media controls (MPRIS)
β”‚       β”œβ”€β”€ weather.rs      # Weather API
β”‚       β”œβ”€β”€ clipboard.rs    # Clipboard history
β”‚       β”œβ”€β”€ notifications.rs # Notification center
β”‚       └── timer.rs        # Timer/Stopwatch
└── .github/workflows/      # CI/CD

Tech Stack

Layer Technology Why
Runtime Tauri 2.0 ~15MB RAM, native performance
Frontend Svelte 5 Smallest bundle, best reactivity
Backend Rust Zero-cost abstractions, system APIs
Styling CSS Glassmorphism, animations, no deps
Weather Open-Meteo Free, no API key needed
Media MPRIS/playerctl Universal Linux media control

Controls

Action Result
Hover Expand island
Click widget icon Switch active widget
Enter (island focused) Toggle expand/collapse
Move mouse away Auto-collapse after 2 seconds

Customization

The theme colors live directly in the component styles under src/lib/components/. To reskin the island, search and replace the palette:

Color Hex
Neon pink #ff2d95
Neon cyan #00f0ff
Sakura #ffb7c5

Contributing

Contributions are welcome! Please read CONTRIBUTING.md first.

  1. Fork the repository
  2. Create your feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

License

This project is licensed under the MIT License -- see the LICENSE file for details.


Acknowledgements

  • Tauri -- For making lightweight desktop apps possible
  • Svelte -- For the best frontend DX
  • Open-Meteo -- Free weather API
  • Apple -- For the Dynamic Island concept inspiration

Built with love by Thanvish

If you like this project, give it a star!

About

🏝️ Anime-themed Dynamic Island for Desktop β€” Linux & Windows | Tauri 2.0 + Svelte 5 + Rust

Topics

Resources

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages