Code Image Generator

Create your code images by choosing different themes and visual settings.
Images can be copied to the clipboard or downloaded as image files to be shared on social media etc.
Live demo is here.

💻 Tech Stack

• Language: TypeScript
• Framework: Next.js
• Styling: Tailwind CSS
• Linting: ESLint
• Code Formatting: Prettier
• Deployment: GitHub Pages (w/ GitHub Actions)

⌨️ Development

To start development, we should install our packages first.

pnpm install

After the installation is completed, we can run the app by:

pnpm dev

and it will start on http://localhost:3000/code-image-generator.

🚀 Build

To create a production build, we need to run the below command first:

pnpm build

After this step, we can run the app in production mode by:

pnpm start