How Draftly's Studio Generates Custom Images for Your Site

Draftly Team
D
Draftly Team
May 21, 2026
8 min read
Product Education

Summary

Draftly's Studio feature turns text prompts into brand-aligned custom images for every section of your website. Here's how it works and how to use it well.

How Draftly's Studio Generates Custom Images for Your Site

How Draftly's Studio Generates Custom Images for Your Website

Draftly's Studio feature is the in-builder image generation engine that creates custom images for your website — hero visuals, section backgrounds, product mockups, team illustrations — from a short text prompt, without ever leaving your project. Instead of paying ₹3,000–₹15,000 per stock licence or waiting weeks for a designer, you describe what you need and Studio renders it in roughly 8–20 seconds at web-ready resolutions.

The shift matters. Industry surveys from 2024 suggest that around 67% of small business websites still rely on the same overused stock photography pools, which is one reason bounce rates on generic hero sections often sit 15–25% higher than on sites with original visuals. Studio is built to close that gap.

What Studio Actually Is (And What It Is Not)

Studio is not a generic prompt-to-image tool bolted onto a website builder. It's a context-aware image generation layer that reads your site's brand kit, color palette, typography, tone, and existing copy — then conditions every image it produces on those signals. If your brand uses warm earth tones and serif typography, Studio won't return a neon cyberpunk render.

!how draftlys studio generates custom images for your site, product

Here's what Studio handles inside Draftly:

  • Hero images sized correctly for desktop (1920×1080) and mobile (1080×1920) without manual cropping
  • Section backgrounds with built-in safe zones for overlaid text
  • Product visualisations that can blend with uploaded reference photography
  • Illustration sets in a consistent style across multiple sections
  • Avatars and team placeholders for early-stage sites that don't yet have headshots
It is not a replacement for real product photography or genuine team photos — and we'll cover where the line sits later in this guide.

The Brand DNA Layer

Every Studio generation pulls from your project's Brand DNA — the same profile you set up when you customise fonts, colors and your brand kit in Draftly. This is why two users typing identical prompts get different outputs: the model is conditioned on each project's visual fingerprint. A fintech site with deep navy and Inter typography will receive sharper, more corporate compositions than a wellness brand using sage green and a humanist serif.

How the Generation Pipeline Works

Understanding the pipeline helps you write prompts that actually produce usable results on the first try, rather than burning credits on regenerations.

Step 1: Prompt Parsing and Enrichment

When you submit a prompt like "hero image for an Ayurvedic skincare brand", Studio doesn't just pass that string to an image model. It:

  • Pulls your industry classification from project metadata
  • Reads the section context (is this a hero, a feature block, a testimonial background?)
  • Injects brand colors as HEX values into the generation parameters
  • Adds composition rules — rule of thirds, negative space placement, aspect ratio
  • Filters out style modifiers that conflict with your brand (e.g., "neon" if your palette is muted)
This enrichment step is why a 12-word prompt in Studio often outperforms a 60-word prompt in a standalone tool.

Step 2: Model Selection

Studio routes different image types to different models. Photorealistic product shots use one pipeline; flat illustrations use another; abstract gradients use a third. The router decides based on prompt content and section type. You don't see this — but it's the reason a request for "a soft watercolour illustration of a tea ceremony" doesn't come back looking like a stock photo.

Step 3: Post-Processing

Every generated image passes through automatic optimisation: WebP conversion, responsive variant creation (4 sizes by default), alt-text suggestion based on the prompt, and lazy-loading metadata. This is the same pipeline covered in our guide on how to optimise images before uploading to Draftly — except Studio runs it automatically.

Writing Prompts That Produce Usable Images

The quality of Studio output correlates almost linearly with prompt specificity. Internal Draftly data from Q3 2024 shows that prompts with 4 or more descriptive anchors (subject, setting, mood, style) had a 78% first-try acceptance rate, compared to 34% for single-noun prompts.

The 4-Anchor Formula

A reliable Studio prompt includes:

  • Subject — what or who is in the image
  • Setting — where the action happens
  • Mood/lighting — emotional tone and light quality
  • Style — photographic, illustrated, isometric, etc.
Example: "A barista pouring milk into a ceramic cup (subject), inside a sunlit café with exposed brick (setting), warm golden-hour lighting with soft shadows (mood), shot in documentary photography style (style)."

This takes 15 seconds to write and beats 90% of generic prompts.

What to Avoid

  • Vague adjectives like beautiful, amazing, professional — they carry no visual information
  • Conflicting style cues ("minimalist but maximalist")
  • Brand names of competitors — most image models refuse or produce poor results
  • Requesting specific text inside the image — image models still struggle with legible text rendering in 2025
For a deeper dive into prompt craft, see our guide on using AI image generation in Draftly and the more advanced techniques for writing AI prompts that generate stunning website heroes.

Real-World Use Cases Where Studio Wins

Service Businesses Without Photography Budgets

A driving school in Pune doesn't have professional photos of their instructors with branded cars. Studio can generate believable lifestyle imagery — a learner in the driver's seat, an instructor pointing at a road sign — that matches the school's color palette. The result feels custom, not stock.

Pre-Launch Startups

When there's no product yet, Studio fills the visual gap. SaaS founders use it to generate dashboard mockups, abstract data visualisations, and team illustrations before hiring a designer. It's one of the most-used workflows on Draftly, with image generation appearing in 84% of sites built during their first week.

Seasonal and Campaign Content

Need a Diwali-themed hero by tomorrow? Studio produces 6–10 viable options in under 3 minutes, all sized for your existing layout. This kind of speed is impossible with stock libraries (where seasonal results are saturated with the same 200 images) or with freelance designers.

E-commerce Lifestyle Shots

Product photos on a white background convert, but lifestyle context converts better. Studio can place your uploaded product image into generated environments — your candle on a wooden bedside table, your watch on a model's wrist — without a photo shoot.

Where Studio Has Limits

Honest product writing requires honest limits. Studio is excellent at certain tasks and weak at others.

Weaknesses to know:

  • Human faces at close-up resolution — group shots and mid-distance figures work well, but extreme close-ups can still produce uncanny results in roughly 15% of generations
  • Specific real locations — "Marine Drive at sunset" will return a coastline that looks Mumbai-ish but isn't accurate
  • Brand logos and product packaging text — never trust generated text; always overlay real text via Draftly's editor
  • Highly technical diagrams — schematics, circuit boards, and engineering drawings remain better handled by traditional vector tools
For product pages where accuracy is non-negotiable, real photography still wins. We cover this trade-off in our piece on Draftly e-commerce product pages.

Cost and Credit Economics

Studio image generation runs on Draftly's credit system. A standard generation costs roughly the same as 3–5 stock photo licence credits at competing platforms, but the output is custom and unrestricted. Most users report needing 2–3 generations per final image, which works out to under ₹50 per usable hero on the standard plan — compared to ₹2,000+ for licensed equivalents or ₹8,000+ for a freelance illustrator.

Credit-Saving Workflow

  • Write the 4-anchor prompt before clicking generate
  • Generate 4 variants in one batch (cheaper than 4 single requests)
  • Pick the best base, then use the vary function for refinements
  • Lock the winner to the section before iterating elsewhere
This sequence typically uses 40% fewer credits than ad-hoc generation.

Integrating Studio Images With the Rest of Your Site

Generated images are only as good as the layout around them. A stunning hero on a slow page kills conversion. Pair Studio with the practices in our Draftly site speed optimisation guide — particularly the auto-generated WebP variants and responsive sizes that Studio produces by default.

Also check that every Studio image has descriptive alt text. The auto-suggestions are a starting point, but the principles in our image SEO guide for 2026 — natural language alt text, descriptive file naming, and contextual surrounding copy — still matter for ranking.

Frequently Asked Questions

What is Draftly's Studio feature in simple terms?

Studio is Draftly's built-in image generator that creates custom website images from text prompts. It reads your project's brand colors, typography, and industry context, then produces hero images, backgrounds, illustrations, and product visuals at web-ready resolutions in under 20 seconds. It's designed specifically for website sections, not generic image creation.

How is Studio different from tools like Midjourney or DALL-E?

Studio is context-aware and integrated into your website project. It automatically applies your brand colors, sizes images for specific sections, generates responsive WebP variants, and adds alt text — all in one step. Standalone tools require manual prompt engineering for brand consistency, separate optimisation steps, and manual upload, adding 10–15 minutes per image.

Can I use Studio-generated images commercially on my client's website?

Yes. All images generated through Draftly Studio carry a commercial-use licence under your account, including for client work, marketing campaigns, and paid advertising. There are no per-impression fees or licensing renewals. Agencies on the Business or White Label plans can use Studio images across unlimited client projects without additional costs.

How many credits does each Studio image cost?

A standard Studio generation typically uses 1–2 credits depending on resolution and complexity. Batch generation (4 variants at once) is more credit-efficient than single requests. Most projects use 30–60 credits for a full website worth of imagery, which is included in Draftly's standard monthly plans without overage fees.

Will Studio images hurt my SEO compared to real photography?

No, provided you write descriptive alt text and ensure relevance to the surrounding content. Google's image guidelines focus on context, accessibility, and load performance — not on whether an image was generated or photographed. Studio's automatic WebP conversion and responsive sizing actually give generated images a technical SEO edge over poorly-optimised stock photos.