๐Ÿ“ก No internet connection. Favicon refresh is unavailable.
๐ŸŽฎ Demo Mode โ€” changes are not saved and reset on every reload. โฌ‡ Download your own copy
12:00
Jan 1, 2025
×
Edit
Quick Edit (Name & URL)
Delete
Move to...
Move all to...
Refresh Thumbnail
Refresh All Thumbnails
Refresh ALL Dials (all folders)
Apply Default to all

Confirm

Settings

Colors ▶
10%
80%
Clock ▶
10%
Background Images ▶

Images are resized and compressed before saving. Page BG is capped at 70% of 1280px wide to save storage.

Other Settings ▶
Advanced ▶

Custom CSS

CSS Guide

This guide provides essential CSS selectors to customize your speed dial. Use !important to ensure your styles override the defaults.

Common Selectors

  • body - The main page
  • .top-bar - The entire top bar
  • .time - The clock text
  • .date - The date text
  • #search-box - The search input field
  • .folder - All folder buttons
  • .folder.active - The currently selected folder
  • .dial - All dial items
  • .dial-thumbnail - A dial's thumbnail box
  • .dial-name - A dial's name label

Targeting Specific Items

To target a specific item, use your browser's "Inspect" tool to find its data-id:

.folder[data-id="123456789"] { background: blue !important; }

.dial[data-id="987654321"] .dial-name { color: yellow !important; }

Common Properties

  • color: #ff0000; (text color)
  • background-color: blue; (background color)
  • font-family: "Courier New", monospace; (font style)
  • font-size: 1.5em; (text size)
  • border-radius: 0px; (corner roundness)
  • border: 1px solid blue; (border)
  • opacity: 0.8; (transparency)

Add Folder

Add Dial

Quick Edit Dial

Dial Settings

Auto Favicon
Solid Color
Custom Image

Favicon is fetched automatically from the URL.

Folder Settings

Move to...