All in one

A single HTML file packed with polish

Hover highlights, 3D tilt, parallax art, syntax‑highlighted code with copy, scroll progress + ring, tooltips, reveal animations, theme + accent persistence, command palette, carousel, tabs, modal, toast, live search, D&D cards, sortable table, canvas chart, file drop, notes autosave, image filters, timers, device APIs, drawer menu, bottom bar, haptics, dictation, geolocation, camera, PWA offline, install prompt, self‑download, and more.

Explore features Download this page Get in touch

Features loaded: …

Feature Highlights

Hover any card to see tilt + glossy spotlight. Drag cards to reorder. Use the filter to search live. Press J/K to jump sections.

Parallax & Spotlight

Background reacts to your cursor with gradient shading. Foreground art moves on depth layers.

Smooth Scroll & Spy

Sticky header and section spy highlight current section. Top bar and ring show progress.

Reveal on View

Sections fade and lift into view via IntersectionObserver. Accessible and buttery.

Tabs & Carousel

Accessible tabs with panels, swipe‑friendly carousel with dots and autoplay pause.

Modal & Toast

Accessible dialog and lightweight notification system.

Command Palette

⌘/Ctrl+K opens quick navigation. ? shows shortcuts.

Code Demo

Tiny JS helper that builds a glowing mouse‑follow highlight and copies code on click.

const area = document.querySelector('.interactive');
area.addEventListener('pointermove', (e) => {
  const r = area.getBoundingClientRect();
  area.style.setProperty('--mx', (e.clientX - r.left) + 'px');
  area.style.setProperty('--my', (e.clientY - r.top) + 'px');
});

Canvas Chart

Simple bar chart rendered to <canvas> with randomize and fullscreen.

Sortable Table

Click headers to sort. Shift‑click to multi‑sort.

NameScoreDate

Notes (Autosave + Dictation)

Your text is stored locally in your browser. Use the mic to dictate if supported.

File Drop, Preview & Filters

Drop an image or text file to preview without upload. Adjust image filters.

Drop files here or click to select
0 = none • 100 = dramatic

Timers

Countdown

seconds 60

Pomodoro

Idle

Device Features

Mobile-friendly extras: haptics, geolocation, orientation-based parallax, connection info.

Location: unknown Orientation: n/a Shake: n/a
Draw with your finger or mouse. Long-press clears.

Camera

Capture from your device camera (requires HTTPS or localhost). Toggle torch if supported.

Off

Download This Page

Everything on this site lives in this one file. Click below to download the full, self‑contained index.html you are viewing.

Inline source (generated on demand)

FAQ

Is everything really in one file?
Yes. All CSS and JS live in this HTML for easy drop‑in hosting. It also includes an inlined Service Worker to enable offline caching once installed.
Does it respect reduced motion?
Yes. If your system prefers reduced motion, animations and auto-scrolling are minimized.
How do I export my settings?
Use “Export settings” in the sidebar. It includes theme, accent, font size, and more.

Contact

This button opens your default email client. Replace the address with yours.

Email me
Download Contact