Graphix

Graphix is a powerful, easy-to-use platform designed to unleash your creativity. Whether you're a professional designer or a beginner, create stunning graphics, social media posts, and more with customizable templates, drag-and-drop tools, and seamless collaboration features. Empower your ideas with Graphix intuitive design experience!

Tech Stack

• Next.js: Frontend / Backend
• PostgreSQL + Redis + Drizzle: Database + ORM
• FabricJS: Canvas library
• shadcn/ui: UI library
• Zod: Validation in both frontend & backend
• TanStack Query: Data fetching, caching, and synchronization for APIs
• Hugging Face - Stable Diffusion 3.5-large: AI image generation
• Remove.bg: Background removal

Features

Settings

• Change color of canvas
• Adjust canvas size
• Zoom in and zoom out canvas
• Reset to previous zoom state

Shapes

• Add Shapes
• Customize:
  • Fill color
  • Stroke (color, styles, width)
  • Opacity
• Delete Shapes
• Layer Shapes:
  • Organize into different layers of shapes or text
  • Duplicate Shapes
  • Duplicate selected shapes on the canvas

Text

• Add Text
• Text Options:
  • Textbox
  • Heading
  • Subheading
  • Paragraph
• Customize:
  • Font family
  • Fill color
  • Font styles (Italic, Bold, Strikethrough)
  • Alignment (Left, Right, Center)
  • Font size
  • Opacity
• Layer Text:
  • Organize into different layers of shapes or text
  • Duplicate Text
  • Duplicate selected text on the canvas

Images

• Add Images
• Apply Filters:
  • Apply predefined filters (e.g., sepia, black and white, vintage, ... +20 more)
• Duplicate Images
  • Duplicate selected images on the canvas

Drawing

• Freehand Drawing
• Customize:
  • Brush color
  • Brush width

Background Removal

• Remove the background from uploaded images using Remove.bg API.

AI Features

• AI Image Generation
  • Generate unique images using prompts with Stable Diffusion 3.5.

General

• Delete Text and Shapes
• Duplicate Objects
  • Duplicate selected objects (shapes, text, images) on the canvas