An immersive rain-effect reader. London streets glimpsed through glass, rain tracing slow lines down the screen.
The floating toolbar runs along the bottom of the reader panel, left to right:
| Button | Icon | Function |
|---|---|---|
| Pen | ✏️ | Highlight mode — Click to activate; selected text is underlined in amber. Click again to switch off. |
| Lightning | ⚡ | Lightning effect — Active: icon glows yellow. Inactive: icon dims with a red diagonal line. |
| Speaker | 🔊 | Volume — Hover to reveal a horizontal slider. Drag to adjust the rain ambience. |
| Bin | 🗑️ | Clear highlights — Removes all annotations from the current document. |
| Plus | ➕ | Load document — Opens a menu: upload a local .md file, or paste a URL. |
| Minus | ➖ | Clear document — Closes the current document and returns to the start page. |
| Left arrow | ◀ | Page up — Scrolls up by one screen height. |
| Page number | 1/3 | Current page / total pages. Displays — when the document fits on one screen. |
| Right arrow | ▶ | Page down — Scrolls down by one screen height. |
| Button | Function |
|---|---|
| 🏠 House | Home |
| 👁️ Eye | Show / hide the reader panel |
| 📡 Signal | Open / close the settings panel |
Click the signal icon (top right) to open. Click again to collapse.
Media Source
- Upload Media — Replace the background with your own image or video
Atmosphere
- Rain Intensity — How heavy the rain falls
- Glass Blur — How frosted the glass appears
- Speed — How quickly the drops slide
Optics
- Refraction — Strength of the lens distortion through each droplet
- Zoom — Background zoom level
Image
- Brightness — Fine-tune the overall brightness
- Drag a file onto the page → Instantly swap the background image/video, or load a
.mddocument - Drag the bottom-right corner → Resize the reader panel
Rain sounds play automatically on load. Use the speaker button to adjust the volume.
Shader based on Shadertoy's Heartfelt by BigWings
Concept and original prompt by mmguo — Rainy Typewriter