A browser-based Star Wars opening crawl generator written in plain HTML, CSS, and JavaScript. It recreates the iconic opening sequence from the Star Wars films, with the classic title card, episode text, subtitle, and body crawl.
- Default content: Comes preloaded with the classic Star Wars opening text.
- Custom text: Replace the title card, episode, subtitle, and body with your own.
- Starfield: Adjustable star count with toggle.
- Typography: Crawl width, base font size, and letter spacing controls.
- Animation timing: Sliders for crawl duration, title hold/fade, and logo hold/fly-out.
- Perspective: Adjustable tilt and perspective depth.
- Logo: Default Star Wars logo with adjustable display timing.
- Music:
- Load a local audio file (royalty-free or licensed).
- Delay start, sync offset, and fade-out controls.
- Fade-out can be set to align with the crawl ending.
- Responsive: Works in modern browsers, adapts to full screen.
This project uses the Star Jedi Outline font for the logo. Download it here:
- Download the font
.ttffile from the link above. - Install it on your system:
- Windows: Right-click the
.ttffile and select Install. - macOS: Double-click the
.ttffile and click Install Font. - Linux: Copy the
.ttffile to~/.fontsor use your distro’s font manager.
- Windows: Right-click the
- Restart your browser to ensure the font is recognized.
If the font is not installed, the logo will fall back to a system font.
- Open
crawl.htmlin a modern browser (Chrome, Edge, Firefox). - Use the default Star Wars text, or customize via the left panel.
- (Optional) Load an audio file from your system.
- Click Full Screen + Start.
- Record the playback with screen capture if you want an
.mp4.
- Pure HTML/CSS/JS, no frameworks.
- Uses CSS custom properties for animation timing and layout.
- Canvas used for starfield rendering.
- Includes a small self-test suite for text splitting.
- The original Star Wars score is copyrighted and not included. Use your own licensed or royalty-free music.
- Tested on Chrome/Edge/Firefox at 1080p and 4K.
MIT License. Free to use, modify, and distribute. See LICENSE for details.
© 2025. This project was AI-assisted. You may share and modify without attribution.