Skip to main content

Overview

Meelio’s backgrounds feature lets you customize your workspace with beautiful wallpapers, including both static images and live video backgrounds. Choose from a curated collection of high-quality backgrounds or upload your own to create a workspace that inspires you. With support for both static and live wallpapers, blur hash previews for smooth loading, and optional daily rotation, your Meelio workspace can feel fresh and personalized.

Key Features

Curated Collection

Access a library of professionally selected wallpapers

Live Wallpapers

Choose animated video backgrounds for dynamic workspaces

Daily Rotation

Automatically change wallpapers daily for variety

Custom Uploads

Add your own images as backgrounds

Wallpaper Types

Meelio supports two types of wallpapers:

Static Wallpapers

Static wallpapers are high-quality images:
  • High Resolution: Optimized for all screen sizes
  • Fast Loading: Blur hash previews while loading
  • Minimal Resource Usage: Low performance impact
  • Wide Variety: Landscapes, abstract, minimalist designs

Live Wallpapers

Live wallpapers feature subtle video loops:
  • Video Backgrounds: Smooth, looping video content
  • Fallback Images: Static fallback if video doesn’t load
  • Optimized Performance: Lightweight video files
  • Immersive Experience: Dynamic, engaging backgrounds
Live wallpapers use more system resources than static wallpapers. If you experience performance issues, switch to a static wallpaper.

Changing Your Wallpaper

1

Open Background Settings

Access the backgrounds panel in Meelio settings.
2

Browse Wallpapers

Scroll through the available wallpapers. Each shows a thumbnail preview.
3

Select a Wallpaper

Click any wallpaper to set it as your current background.
4

Enjoy Your New View

The wallpaper applies immediately and persists across sessions.

Wallpaper Properties

Each wallpaper includes:
  • ID: Unique identifier for the wallpaper
  • Title: Descriptive name
  • Author: Creator attribution
  • Type: Static or live
  • Source: Where the wallpaper comes from (local, Unsplash, custom)
  • Thumbnail: Preview image with blur hash
  • Full URL: High-resolution image or video URL
  • Blur Hash: Fast-loading preview placeholder

Wallpaper Sources

Curated wallpapers included with Meelio:
  • Professionally selected
  • Optimized for performance
  • High quality and resolution
  • No external loading required (after first view)
Beautiful photography from Unsplash:
  • Professional photography
  • Proper attribution to photographers
  • High-resolution images
  • Wide variety of subjects and styles
Upload your own images:
  • Personal photos
  • Custom artwork
  • Brand materials
  • Any image that inspires you

Daily Wallpaper Rotation

Enable automatic daily wallpaper changes:
  • Rotation Setting: Toggle in app settings
  • Daily Selection: New wallpaper chosen each day
  • Seed-Based: Uses date-based selection for consistency
  • Fresh Experience: Wake up to a new background daily

How Daily Rotation Works

  1. When rotation is enabled, Meelio selects a wallpaper based on the current date
  2. The same date always shows the same wallpaper (deterministic)
  3. Each day, a different wallpaper from your collection is displayed
  4. The rotation cycles through all available wallpapers
Daily rotation uses a date-based seed to select wallpapers. This means you’ll see the same wallpaper on the same date each year, creating seasonal consistency.

Managing Wallpapers

Setting Current Wallpaper

Change your wallpaper anytime:
setCurrentWallpaper(wallpaper)
  • Applies immediately
  • Saves to local storage
  • Syncs across devices (when authenticated)
  • Persists across browser sessions

Removing Custom Wallpapers

Delete wallpapers you’ve added:
  • Only custom wallpapers can be removed
  • Default wallpapers are always available
  • Removing a wallpaper reverts to default if it was active

Reset to Default

Restore the original wallpaper collection:
  • Removes all custom wallpapers
  • Resets to curated default collection
  • Selects a default wallpaper based on rotation settings
Resetting to default removes all custom wallpapers. This action cannot be undone.

Performance Optimization

Blur Hash Previews

Meelio uses blur hash technology:
  • Instant Preview: Show a blurred version immediately
  • Smooth Transition: Fade from blur hash to full image
  • Perceived Performance: Feels faster even if loading takes time
  • Small Data Size: Blur hash is only a few bytes

Image Optimization

Wallpapers are optimized for performance:
  • Appropriate resolution for screens
  • Compressed without visible quality loss
  • Cached after first load
  • Lazy loading when browsing

Live Wallpaper Optimization

Video backgrounds are performance-optimized:
  • Compressed video files
  • Looping video segments
  • Fallback images for compatibility
  • Automatic quality adjustment

Storage and Caching

Wallpaper preferences are stored locally:
  • Current wallpaper selection
  • Custom wallpaper data
  • Rotation settings
  • Persists across browser sessions
Images are cached by the browser:
  • First load downloads the image
  • Subsequent loads use cached version
  • Faster loading on repeat visits
  • Reduced bandwidth usage
Wallpaper storage is versioned:
  • Current version: 8
  • Handles migration between versions
  • Ensures compatibility with updates
  • Preserves your customizations

Tips and Best Practices

Match Your Mood

Choose wallpapers that match your work mode. Calm nature scenes for focused work, energetic patterns for creative tasks.

Consider Contrast

Ensure your wallpaper doesn’t make text hard to read. Darker or more muted wallpapers often work better with overlaid content.

Enable Rotation

Daily rotation keeps your workspace fresh without manual effort. Great for discovering wallpapers you might not choose manually.

Try Live Wallpapers

Live wallpapers add subtle movement that can be energizing, but switch to static if you find them distracting.

Seasonal Themes

Manually choose wallpapers that match the season or upcoming holidays for a festive touch.

Custom Wallpaper Guidelines

When adding custom wallpapers:
  • Resolution: Use high-resolution images (1920x1080 or higher)
  • File Size: Keep file sizes reasonable (under 5MB) for performance
  • Aspect Ratio: Wide aspect ratios (16:9, 21:9) work best
  • Content: Choose images that won’t distract from your work
  • Format: JPEG, PNG, and WebP are supported

Accessibility Considerations

If you’re sensitive to motion or find live wallpapers distracting, stick with static wallpapers. Your workspace should enhance productivity, not hinder it.

Reducing Visual Distraction

  • Choose simpler, more minimalist wallpapers
  • Avoid high-contrast or busy patterns
  • Consider darker wallpapers to reduce screen brightness
  • Disable daily rotation if consistency helps you focus

Troubleshooting

If a wallpaper won’t display:
  1. Check your internet connection (first load only)
  2. Try selecting a different wallpaper
  3. Clear browser cache and reload
  4. Reset to default wallpapers
  5. Check browser console for errors
If video wallpapers won’t play:
  1. Check if video autoplay is enabled in browser settings
  2. Verify internet connection
  3. Look for the fallback image (means video failed)
  4. Try a different live wallpaper
  5. Switch to a static wallpaper if issues persist
If wallpapers cause slowness:
  1. Switch from live to static wallpapers
  2. Choose simpler wallpapers with less detail
  3. Clear browser cache to free up memory
  4. Close other browser tabs
  5. Check system resource usage
If you can’t upload custom wallpapers:
  1. Verify file format (JPEG, PNG, WebP)
  2. Check file size (should be under 5MB)
  3. Ensure image is valid and not corrupted
  4. Try a different image
  5. Check browser console for upload errors

Integration with Other Features

Cohesive Aesthetic

Your wallpaper sets the tone for your entire Meelio workspace. Choose wallpapers that complement your other customizations like theme colors and dock settings.

Mood and Productivity

Different wallpapers can signal different work modes. A calm nature scene might indicate deep focus time, while an energetic abstract pattern might support creative brainstorming.

Default Wallpaper Collection

Meelio includes a curated collection of default wallpapers:
  • Carefully selected for quality and variety
  • Mix of static and live options
  • Different themes: nature, abstract, minimalist, artistic
  • Proper attribution to creators
  • Optimized for performance
The default collection is always available even after adding custom wallpapers.
The current default wallpaper is index 3 in the collection, but this may change with daily rotation enabled.

Build docs developers (and LLMs) love