Edit. Enhance. Express.
Edix is a professional-grade, AI-powered image editing platform built with Next.js. Designed for creators, developers, marketers, and everyday users who demand powerful editing capabilities with intuitive design. Transform your images with cutting-edge AI tools.
🌟 Live Showcase • ✨ Features • 💎 Pricing • 🛠️ Tech Stack • 📦 Setup • 🔌 API
- ✂️ Precision Editing: Advanced crop, rotate, flip, and resize with pixel-perfect accuracy
- 🎨 Color Mastery: Professional-grade brightness, contrast, saturation, hue, and exposure controls
- 🖋️ Creative Overlays: Rich text editing, custom stickers, freehand drawing with brush controls
- 📐 Transform Tools: Scale, skew, perspective correction, and geometric transformations
- 🔄 Non-destructive Editing: Maintain original quality with layer-based editing
- 🖼️ Background Library: Access millions of high-quality Unsplash backgrounds for creative projects
- 🌟 Smart Background Removal: One-click AI background removal with edge refinement
- 🔍 AI Image Upscaler: Enhance resolution up to 4x with AI super-resolution
- 🎭 AI Retouch & Restore: Automatic blemish removal, noise reduction, and photo restoration
- 🖼️ AI Image Extender: Intelligently expand image boundaries with contextual generation
- 🎨 Smart Filters: AI-curated filter suggestions based on image content
- � Auto-Enhancement: One-click intelligent color correction and optimization
- 📁 Project Management: Organize projects in folders with hierarchical structure
- 💾 Cloud Storage: Secure image storage with ImageKit integration
- 📤 Multi-format Export: Export in PNG, JPG, WebP, SVG formats with quality control
- 📱 Cross-platform: Responsive design optimized for desktop, tablet, and mobile
- ⚡ Real-time Preview: Instant preview of edits with hardware acceleration
- 👤 Authentication: Secure user authentication with Clerk
- 👥 User Profiles: Personalized workspace with usage analytics
- � Data Security: End-to-end encryption for uploaded images
- 📊 Usage Tracking: Monitor projects, exports, and subscription limits
Perfect for casual users and trying out Edix
- 3 projects maximum
- 20 exports per month
- Basic editing tools (crop, resize, rotate)
- Color adjustments (brightness, contrast, saturation)
- Text overlays with basic fonts
- Limited background images (10 downloads/day from Unsplash)
- Standard export quality
- Community support
Save 15% with annual billing ($8.50/month)
Unleash the full power of AI-driven image editing
- Unlimited projects
- Unlimited exports
- All editing tools (advanced transforms, filters, effects)
- AI Background Remover with edge refinement
- AI Image Extender for seamless expansion
- AI Upscaler up to 4x resolution enhancement
- AI Retouch & Restore tools
- Premium filters and presets
- Unlimited background images from Unsplash library
- Priority cloud storage (10GB)
- High-resolution exports (up to 8K)
- Priority support with 24/7 assistance
- Early access to beta features
- Next.js 15.4.4 – React framework with App Router, SSR, and edge functions
- React 19.1.0 – Component-based UI library with latest features
- TypeScript 5.0 – Type-safe development with advanced tooling
- Tailwind CSS 4.0 – Utility-first CSS framework with modern design system
- Radix UI – Headless UI components for accessibility and customization
- Lucide React – Beautiful, customizable SVG icons
- Next Themes – Dark/light theme support
- Fabric.js 6.7.1 – Powerful HTML5 canvas library for interactive graphics
- React Colorful – Lightweight color picker component
- React Dropzone – Flexible file upload with drag & drop
- Unsplash API – Access to millions of high-quality background images
- ImageKit – Cloud-based image optimization, storage, and CDN
- Prisma 6.12.0 – Type-safe database ORM with PostgreSQL
- PostgreSQL – Robust relational database for production
- Clerk – Complete authentication and user management
- Clerk Themes – Customizable auth UI components
- Clerk Webhooks – Real-time user data synchronization with database
- Svix – Webhook verification and security for Clerk integration
- ESLint – Code linting with Next.js configuration
- Date-fns – Modern date utility library
- Axios – HTTP client for API requests
- Sonner – Beautiful toast notifications
- React Spinners – Loading indicators
- Node.js 18.0 or later
- npm or yarn package manager
- PostgreSQL database
- ImageKit account (for image storage)
- Clerk account (for authentication)
- Unsplash Developer account (for background images)
# Clone the repository
git clone https://github.com/adityakashyap5047/Edix.git
cd edix
# Install dependencies
npm install
# Set up environment variables
cp .env.example .env.local
# Fill in your environment variables (see Configuration section)
# Set up the database
npx prisma generate
npx prisma db push
# Run the development server
npm run devOpen http://localhost:3000 to view the application.
Create a .env.local file with the following variables:
# Database
DATABASE_URL="postgresql://username:password@localhost:5432/edix"
# Clerk Authentication & User Management
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
CLERK_SECRET_KEY=your_clerk_secret_key
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
CLERK_WEBHOOK_SECRET=your_clerk_webhook_secret # For real-time user data sync
# ImageKit (Image Storage & Optimization)
NEXT_PUBLIC_IMAGEKIT_PUBLIC_KEY=your_imagekit_public_key
IMAGEKIT_PRIVATE_KEY=your_imagekit_private_key
NEXT_PUBLIC_IMAGEKIT_URL_ENDPOINT=your_imagekit_url_endpoint
IMAGEKIT_TOKEN=your_imagekit_token
# Unsplash (Background Images)
NEXT_PUBLIC_UNSPLASH_ACCESS_KEY=your_unsplash_access_key # For background image library
# App Configuration
NEXT_PUBLIC_APP_URL=http://localhost:3000- Create a Clerk account and new application
- Copy the publishable and secret keys from your Clerk dashboard
- Set up webhooks for user synchronization:
- Go to Webhooks in your Clerk dashboard
- Add endpoint:
https://edix.vercel.app/api/clerk - Select events
- Copy the webhook secret for
CLERK_WEBHOOK_SECRET
- Create an Unsplash Developer account
- Register a new application for your project
- Copy the Access Key for
NEXT_PUBLIC_UNSPLASH_ACCESS_KEY - Note: Free tier includes 50 requests per hour
- Create an ImageKit account
- Get your credentials from the ImageKit dashboard
- Configure transformation settings for optimal performance
edix/
├── src/
│ ├── app/ # Next.js App Router
│ │ ├── (auth)/ # Authentication pages
│ │ │ ├── sign-in/ # Sign in page
│ │ │ └── sign-up/ # Sign up page
│ │ ├── (main)/ # Main application
│ │ │ ├── dashboard/ # User dashboard
│ │ │ └── editor/ # Image editor
│ │ ├── api/ # API routes
│ │ │ ├── imagekit/ # ImageKit integration
│ │ │ ├── projects/ # Project management
│ │ │ └── users/ # User operations
│ │ ├── globals.css # Global styles
│ │ ├── layout.tsx # Root layout
│ │ └── page.tsx # Landing page
│ ├── components/ # Reusable components
│ │ ├── Home/ # Landing page components
│ │ └── ui/ # UI component library
│ ├── context/ # React contexts
│ ├── hooks/ # Custom React hooks
│ ├── lib/ # Utility libraries
│ └── types/ # TypeScript type definitions
├── prisma/ # Database schema and migrations
├── public/ # Static assets
├── components.json # Shadcn/ui configuration
├── next.config.ts # Next.js configuration
├── tailwind.config.js # Tailwind CSS configuration
└── tsconfig.json # TypeScript configuration
Automatic user data synchronization between Clerk and your database.
// Webhook handler automatically:
// Creates user records in database
// Updates user information changes
// Handles user deletion cleanup
// Syncs subscription statusAccess to millions of high-quality stock photos for backgrounds.
Features:
// Search backgrounds by keyword
// Curated collections
// High-resolution downloads
// Attribution handlingOptimized image storage, processing, and delivery.
Features:
- Real-time image transformations
- WebP/AVIF format conversion
- CDN delivery worldwide
- Automatic optimization
We welcome contributions from the community! Here's how you can help:
- 🐛 Bug Reports: Report issues with detailed reproduction steps
- 💡 Feature Requests: Suggest new features or improvements
- 🔧 Code Contributions: Submit pull requests for bug fixes or features
- 📚 Documentation: Improve documentation and tutorials
- 🎨 Design: Contribute UI/UX improvements
- Fork the repository
- Create a feature branch:
git checkout -b feature/amazing-feature - Make your changes with proper commit messages
- Add tests for new functionality
- Ensure all tests pass:
npm test - Submit a pull request with detailed description
- Follow TypeScript best practices
- Use Prettier for code formatting
- Write meaningful commit messages
- Add JSDoc comments for complex functions
- Ensure accessibility compliance
This project is licensed under the MIT License - see the LICENSE file for details.
Special thanks to the amazing open-source community and these fantastic projects:
- Fabric.js - For powerful canvas manipulation
- Next.js - For the incredible React framework
- Tailwind CSS - For beautiful, utility-first styling
- Prisma - For type-safe database operations
- Clerk - For seamless authentication
Aditya Kashyap
- 🌐 Website: Aditya Kumar
- 📧 Email: Aditya Kumar
- 🐙 GitHub: Aditya Kumar
- 💼 LinkedIn: Aditya Kumar
- 📧 Email Support: Aditya Kumar
- 🐛 Bug Reports: GitHub Issues
- 💡 Feature Requests: GitHub Discussions
Made with ❤️ and lots of ☕ by the Edix Team