Skip to content
VercelLogotypeVercelLogotype
LoginSign Up

Scribble Diffusion

Turn your rough sketch into a refined image using AI. Powered by Replicate and ControlNet.

DeployView Demo

๐Ÿ–๏ธ Scribble Diffusion

Try it out at scribblediffusion.com

How it works

This app is powered by:

๐Ÿš€ Replicate, a platform for running machine learning models in the cloud.

๐Ÿ–๏ธ ControlNet, an open-source machine learning model that generates images from text and scribbles.

โ–ฒ Vercel, a platform for running web apps.

โšก๏ธ Next.js server-side API routes, for talking to the Replicate API.

๐Ÿ‘€ Next.js React components, for the browser UI.

๐Ÿƒ Tailwind CSS, for styles.

Development

  1. Install a recent version of Node.js
  2. Copy your Replicate API token and set it in your environment:
    echo "REPLICATE_API_TOKEN=<your-token-here>" > .env.local
  3. Install dependencies and run the server:
    npm install
    npm run dev
  4. Open localhost:3000 in your browser. That's it!
GitHub
Ownerreplicate
Repositoryscribble-diffusion
Use Cases
AI
Stack
Next.js
Tailwind

Related Templates

Paint by Text

Edit your photos by chatting with a generative AI model (InstructPix2Pix), powered by Replicate.
Paint by Text thumbnail

Inpainter with Stable Diffusion

Next.js application for inpainting with Stable Diffusion using the Replicate API.
Inpainter with Stable Diffusion thumbnail

Extrapolate โ€“ย AI Aging App

Age transformation AI app powered by Next.js, Replicate, Upstash, and Cloudflare R2 + Workers.
Extrapolate โ€“ย AI Aging App thumbnail

Agent Stack

  • AI SDK
  • AI Gateway
  • Sandbox
  • Workflows
  • ConnectNew
  • PassportNew
  • eveNew

Core Platform

  • CI/CD
  • Content Delivery
  • Fluid Compute
  • Observability

Security

  • Platform Security
  • WAF
  • Bot Management
  • Bot ID

Tools

  • Vercel DropNew
  • Vercel Agent
  • Vercel PluginNew
  • Agent Skills
  • Next.js
  • Domains
  • v0

Frameworks

  • eveNew
  • Nuxt
  • SvelteKit
  • Nitro
  • Turborepo
  • Tanstack Start
  • FastAPI
  • xmcp
  • All frameworks

SDKs

  • Vercel SDK
  • Workflow SDKNew
  • Flags SDK
  • Chat SDKNew
  • Queues SDKNew
  • Streamdown

Build

  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
  • Platform Engineers
  • Design Engineers

Learn

  • Docs
  • Blog
  • Changelog
  • Knowledge Base
  • Academy
  • Articles
  • Community

Explore

  • Customers
  • Marketplace
  • Templates
  • Partner Finder
  • Vercel + AWS

Company

  • About
  • Careers
  • Press
  • Events
  • Startups
  • Shipped on Vercel
  • Open Source Program
  • Enterprise
  • Pricing
  • Help

Legal & Trust

  • Privacy Policy
  • Terms of Service
  • Cookie Policy
  • DPA
  • Acceptable Use Policy
  • Legal (all documents)
  • Trust Center
  • Status

Social

  • GitHub
  • X
  • LinkedIn
  • YouTube
  • Instagram
  • VercelVercel
Agent Stack
  • AI SDK
  • AI Gateway
  • Sandbox
  • Workflows
  • Passport
  • eve
Core Platform
  • Security
  • Content Delivery
  • Fluid Compute
  • Observability
  • CI/CD
Tools
  • Next.js
  • Vercel Agent
  • Vercel Plugin
  • Domainsโ†—
  • v0โ†—
Learn
  • Docs
  • About
  • Blog
  • Changelog
  • Knowledge Base
Build
  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
Explore
  • Customers
  • Marketplace
  • Partner Finder
  • AWS
  • Communityโ†—
EnterprisePricing
Contact
Log InSign Up
Dashboard

Products

Agent Stack

  • AI SDK
  • AI Gateway
  • Sandbox
  • Workflows
  • Passport
  • eve

Core Platform

  • Security
  • Content Delivery
  • Fluid Compute
  • Observability
  • CI/CD

Tools

  • Next.js
  • Vercel Agent
  • Vercel Plugin
  • Domainsโ†—
  • v0โ†—
Resources

Learn

  • Docs
  • About
  • Blog
  • Changelog
  • Knowledge Base

Build

  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce

Explore

  • Customers
  • Marketplace
  • Partner Finder
  • AWS
  • Communityโ†—
Enterprise
Pricing
Sign UpLog In
Contact
DeployView Demo

Loading statusโ€ฆ

Select a display theme: