FreeCut

Edit videos. In your browser.

FreeCut is a professional-grade video editor that runs entirely in your browser. Professional video editing, zero installation. Create stunning videos with multi-track editing, keyframe animations, real-time preview, and high-quality exports.

Features

• Multi-Track Timeline - Edit video, audio, text, and shapes on separate tracks
• Keyframe Animations - Intuitive keyframe editor for smooth transitions and effects
• Real-Time Preview - See your changes instantly with smooth playback
• Professional Effects - Transitions, fade in/out, opacity, and animations
• Text Overlays - Add customizable text with fonts, colors, and positioning
• Shape Tools - Create rectangles, circles, polygons, and stars
• Audio Editing - Waveform visualization, volume control, and audio fades
• Video Thumbnails - Filmstrip preview for easy navigation
• Undo/Redo - Full history support for confident editing
• High-Performance Storage - Lightning-fast local storage using OPFS
• Flexible Export - Local browser rendering or server-side with Remotion

Quick Start

Prerequisites

• Node.js 18 or higher
• npm 9 or higher

Installation

# Clone the repository
git clone https://github.com/walterlow/freecut.git
cd freecut

# Install dependencies
npm install

# Copy environment config
cp .env.example .env

Running FreeCut

# Start the development server
npm run dev

# In a separate terminal, start the backend server (required for server-side export)
npm run server

# Or run both together
npm run dev:all

Open your browser to http://localhost:5173

Basic Workflow

1. Create a Project - Click "New Project" from the projects page
2. Import Media - Drag and drop video, audio, or image files into the media library
3. Edit - Drag clips to the timeline, trim, arrange, and add effects
4. Animate - Use the keyframe editor to add smooth transitions
5. Preview - Use the player to review your edits in real-time
6. Export - Render your final video locally or via the server

Browser Support

Browser	Minimum Version
Chrome	102+

Note: FreeCut uses modern browser APIs like OPFS (Origin Private File System) for optimal performance. Some features may not work in older browsers.

Environment Configuration

Copy .env.example to .env and configure:

# Frontend (Vite)
VITE_API_BASE_URL=http://localhost:3001/api    # Backend API URL
VITE_ENABLE_SERVER_RENDER=true                  # Enable server-side export

# Backend Server
PORT=3001                                       # Server port
CORS_ORIGIN=http://localhost:5173               # Allowed frontend origin

See .env.example for complete documentation.

Deployment

Component	Platform	Purpose
Frontend	Vercel	Static hosting, CDN
Render Server	Node.js, Remotion rendering	(Optional)

Tech Stack

• React - UI framework with concurrent features
• TypeScript - Type-safe JavaScript
• Vite - Fast build tool with HMR
• Remotion - Programmatic video rendering
• TanStack Router - Type-safe routing
• Zustand - State management
• Tailwind CSS - Utility-first styling
• Shadcn/ui - UI components
• Express - Backend server with SSE

Development

Available Scripts

npm run dev        # Start development server (port 5173)
npm run server     # Start backend server (port 3001)
npm run dev:all    # Run both dev and server concurrently
npm run build      # Build for production
npm run lint       # Run ESLint

Contributing

Contributions are welcome! Here's how you can help:

1. Report Bugs - Open an issue describing the problem
2. Suggest Features - Share your ideas in the discussions
3. Submit PRs - Fork the repo, make your changes, and submit a pull request

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgments

Built with these amazing open source projects:

• Remotion - Programmatic video creation
• Mediabunny - Video processing
• TanStack Router - Type-safe routing
• Zustand - State management
• Shadcn/ui - UI components
• Vite - Build tooling

---