Fix audio/subtitle sync delays by shifting .srt timestamps visually.
npm install
npm run devThen open http://localhost:3000.
- Drag-and-drop
.srtfile loading - Visual offset control — slider (±30s), step buttons, quick presets, manual ms input
- Split preview — original vs shifted timestamps side-by-side
- Inline text editing — click any entry to fix subtitle text
- FPS conversion — rescale all timestamps across frame rates (23.976 → 25fps etc.)
- Undo stack — up to 50 steps, Ctrl+Z
- Search — filter entries by text with highlight
- Smart download — filename encodes the applied offset
| Key | Action |
|---|---|
← / → |
Nudge offset ±500ms |
Ctrl+Z |
Undo last change |
Ctrl+S |
Download resynced .srt |
src/
app/
layout.tsx # Root layout, font loading
page.tsx # Main page, composes all components
globals.css # Design tokens (CSS variables)
page.module.css # Page-level layout styles
components/
DropZone.tsx # File upload with drag-and-drop
OffsetControls.tsx # Slider, presets, FPS converter, actions
EntryList.tsx # Virtualisation-ready subtitle list with inline editing
Toast.tsx # Notification toasts
lib/
srt.ts # SRT parser, serialiser, FPS converter, timestamp utils
useSubSync.ts # All app state via useReducer + history stack
npm run build
npm startOr deploy to Vercel with zero config.