Skip to content
Roboto Studio / evidence

youtube / video

Generating AI images inside of Sanity CMS

Jono AlfordOriginal source ↗

Original video

About this video

Looking to use replicate directly inside of Sanity CMS? Well we've got just the plugin for you. You can download it here: https://www.npmjs.com/package/sanity-plugin-image-gen

Full transcript

Edited transcript from the original Roboto page

Hey folks, how's it going? We're back again. So, um, I just want to show you something very cool that we've built in-house and I'm fairly certain that a lot of people are going to get a lot of use out of this.

So if you notice, we have this new little thing inside of Sanity called Generate Image. Now, the reason why we built this is we kept going to Replicate, we kept taking the data from there, and we kept throwing it back into our blogs. And depending on how good you are at doing that, um, it can take anywhere between like 15 seconds to a minute, which is very, very, you know, frustrating over time, especially when you're trying to create something on the fly and you just don't want to lose that editorial flow.

So, um, this is a plugin that you can now add into Sanity and it runs using the Next.js API routes. Um, I'm going to show you that in a second. It's going to show you how to set it up. Um, and if you are interested in seeing a whole video about how to set this thing up, we're more than happy to do that as well. But first of all, let's get some cute kittens in here, right? Let's generate that. So I'm just typing in "cute kittens." I'm going to hit generate and there you go. Boom! That is from Replicate. They look a little bit unsettling. That's exactly what we want.

But um, we have this whole Advanced Options section and we can do a lot of clever stuff in here. Everything from changing, like, the aspect ratio to the image size, um, and to the number of kittens that you're going to get generated. So, um, and of course we can do things like negative prompts. So we could put "ugly kittens" in here as a negative prompt. But you'll see, nice, very, very cute, very nice.

Um, and you can essentially just click any of these. So if I like this one best, I can hit it. It's going to upload that data. It's going to tell me we've got low battery, which is always great. And there we go. We've got it. That's it working.

Um, so if you're interested in using this, it's actually available here, which is Sanity plugin image gen. Um, it's been published 13 days ago, but we've been kind of just tweaking around with it for the last second. Um, so feel free to run this. Tell me if you get against uh any snags or anything that's kind of difficult to work with.

Um, and again, this is all the configuration that's inside of here. How to actually get it running. It has things like type safety built in, so it should in theory just work and should make it a lot easier for you to get it working. Um, and again, this still needs the Replicate uh ID inside of here. So it needs an API key. Um, but ultimately, all of this should in theory just work and you can tweak it to exactly the way you want. If you want to use a specific image model, you can tweak that. If you want to use specific prompts that start at the beginning (I've seen people use things like with iPhone camera setting so it looks more realistic), all of that is possible with this tool.

So yeah, hope you like it. Tell me how you get on. Take care. Bye-bye.

Read timestamped source captions

0:02hey folks how's it going we're back

0:02hey folks how's it going we're back again so um I just want to show you

0:03again so um I just want to show you

0:03again so um I just want to show you something very cool that we've built in

0:05something very cool that we've built in

0:05something very cool that we've built in house and I'm fairly certain that a lot

0:06house and I'm fairly certain that a lot

0:06house and I'm fairly certain that a lot of people are going to get a lot of use

0:08of people are going to get a lot of use

0:08of people are going to get a lot of use out of this so if you notice we have

0:10out of this so if you notice we have

0:10out of this so if you notice we have this new little thing inside of Sanity

0:12this new little thing inside of Sanity

0:12this new little thing inside of Sanity called generate image now the reason why

0:15called generate image now the reason why

0:15called generate image now the reason why we built this is we built it because we

0:17we built this is we built it because we

0:17we built this is we built it because we kept going to replicate we kept taking

0:19kept going to replicate we kept taking

0:19kept going to replicate we kept taking the data from there and we kept throwing

0:20the data from there and we kept throwing

0:20the data from there and we kept throwing it back into our blogs and depending on

0:22it back into our blogs and depending on

0:22it back into our blogs and depending on how good you are at doing that um it can

0:24how good you are at doing that um it can

0:24how good you are at doing that um it can take anywhere between like 15 seconds to

0:26take anywhere between like 15 seconds to

0:26take anywhere between like 15 seconds to a minute which is very very you know

0:28a minute which is very very you know

0:28a minute which is very very you know frustrating over time especially when

0:30frustrating over time especially when

0:30frustrating over time especially when you're trying to create something on the

0:31you're trying to create something on the

0:31you're trying to create something on the Fly and you just don't want to lose that

0:33Fly and you just don't want to lose that

0:33Fly and you just don't want to lose that editorial flow so um this is a plugin

0:36editorial flow so um this is a plugin

0:36editorial flow so um this is a plugin that you can now add into sanity and it

0:39that you can now add into sanity and it

0:39that you can now add into sanity and it runs using the nextjs API routes um I'm

0:42runs using the nextjs API routes um I'm

0:42runs using the nextjs API routes um I'm going to show you that in a second it's

0:43going to show you that in a second it's

0:43going to show you that in a second it's going to show you how to set it up um

0:44going to show you how to set it up um

0:44going to show you how to set it up um and if you are interested in seeing a

0:46and if you are interested in seeing a

0:46and if you are interested in seeing a whole video about how to set this thing

0:48whole video about how to set this thing

0:48whole video about how to set this thing up we're more than happy to do that as

0:49up we're more than happy to do that as

0:49up we're more than happy to do that as well but first of all let's get some

0:51well but first of all let's get some

0:51well but first of all let's get some cute kittens in

0:53cute kittens in

0:53cute kittens in here right let's generate that so I'm

0:55here right let's generate that so I'm

0:55here right let's generate that so I'm just typing in cute kittens I'm going to

0:56just typing in cute kittens I'm going to

0:56just typing in cute kittens I'm going to hit generate and there you go boom that

0:58hit generate and there you go boom that

0:58hit generate and there you go boom that is from replicate they look a little bit

1:00is from replicate they look a little bit

1:00is from replicate they look a little bit unsettling that's exactly what we want

1:02unsettling that's exactly what we want

1:02unsettling that's exactly what we want but um we have this whole Advanced

1:04but um we have this whole Advanced

1:04but um we have this whole Advanced options section and we can do a lot of

1:06options section and we can do a lot of

1:06options section and we can do a lot of clever stuff in here everything from

1:08clever stuff in here everything from

1:08clever stuff in here everything from changing like the aspect ratio to the

1:10changing like the aspect ratio to the

1:10changing like the aspect ratio to the image size um and to the number of

1:12image size um and to the number of

1:12image size um and to the number of kittens that you're going to get

1:13kittens that you're going to get

1:13kittens that you're going to get generated

1:14generated

1:14generated so um and of course we can do things

1:17so um and of course we can do things

1:17so um and of course we can do things like negative prompts so we could put

1:18like negative prompts so we could put

1:18like negative prompts so we could put ugly kittens in here as a negative

1:19ugly kittens in here as a negative

1:20ugly kittens in here as a negative prompt but you'll see nice very very

1:22prompt but you'll see nice very very

1:22prompt but you'll see nice very very cute very nice um and you can

1:25cute very nice um and you can

1:25cute very nice um and you can essentially just click any of these so

1:26essentially just click any of these so

1:26essentially just click any of these so if I like this one best I can hit it

1:28if I like this one best I can hit it

1:28if I like this one best I can hit it it's going to upload that data

1:30it's going to upload that data

1:30it's going to upload that data it's going to tell me we've got low

1:31it's going to tell me we've got low

1:31it's going to tell me we've got low battery which is always great and there

1:33battery which is always great and there

1:33battery which is always great and there we go we've got it that's it working um

1:35we go we've got it that's it working um

1:35we go we've got it that's it working um so if you're interested in using this

1:37so if you're interested in using this

1:37so if you're interested in using this it's actually available here which is

1:39it's actually available here which is

1:39it's actually available here which is sanity plug-in image gen um it's been

1:41sanity plug-in image gen um it's been

1:41sanity plug-in image gen um it's been published 13 days ago but we've been

1:43published 13 days ago but we've been

1:43published 13 days ago but we've been kind of just tweaking around with it for

1:44kind of just tweaking around with it for

1:44kind of just tweaking around with it for the last second um so feel free to run

1:46the last second um so feel free to run

1:46the last second um so feel free to run this tell me if you get against uh any

1:48this tell me if you get against uh any

1:48this tell me if you get against uh any snags or anything that's kind of

1:50snags or anything that's kind of

1:50snags or anything that's kind of difficult to work with um and again this

1:52difficult to work with um and again this

1:53difficult to work with um and again this is all the configuration that's inside

1:54is all the configuration that's inside

1:54is all the configuration that's inside of here how to actually get it running

1:56of here how to actually get it running

1:56of here how to actually get it running it has things like type safety built in

1:58it has things like type safety built in

1:58it has things like type safety built in so it should in theory just work and you

2:00so it should in theory just work and you

2:00so it should in theory just work and you should make it should make it a lot

2:02should make it should make it a lot

2:02should make it should make it a lot easier for you to make it work um and

2:04easier for you to make it work um and

2:04easier for you to make it work um and again this still needs the replicate uh

2:07again this still needs the replicate uh

2:07again this still needs the replicate uh ID inside of here so it needs an API key

2:10ID inside of here so it needs an API key

2:10ID inside of here so it needs an API key um but ultimately all of this should in

2:13um but ultimately all of this should in

2:13um but ultimately all of this should in theory just work and you can tweak it to

2:15theory just work and you can tweak it to

2:15theory just work and you can tweak it to exactly the way you want if you want to

2:16exactly the way you want if you want to

2:16exactly the way you want if you want to use a specific image model you can tweak

2:18use a specific image model you can tweak

2:18use a specific image model you can tweak that if you want to use specific prompts

2:20that if you want to use specific prompts

2:20that if you want to use specific prompts that start at the beginning so I've seen

2:22that start at the beginning so I've seen

2:22that start at the beginning so I've seen people use things with like iPhone

2:24people use things with like iPhone

2:24people use things with like iPhone camera setting so it looks more

2:25camera setting so it looks more

2:25camera setting so it looks more realistic all of that is possible with

2:27realistic all of that is possible with

2:27realistic all of that is possible with this tool so yeah hope you like it tell

2:30this tool so yeah hope you like it tell

2:30this tool so yeah hope you like it tell me how you get on take care bye-bye

Questions answered

Editorial answers from the original Roboto page.

What is Replicate AI?

Replicate is a platform that lets you run open-source AI models, including image generation models, through a single API. In this plugin we point at Replicate to generate images on demand from a text prompt, instead of opening another tab and pasting the result back into the CMS.

Read the original ↗
How do you generate AI images inside Sanity CMS?

Install the sanity-plugin-image-gen plugin, add your Replicate API key, and an editor can type a prompt directly inside Sanity and get an image back without leaving the studio. The plugin runs through Next.js API routes and uploads the chosen image straight into the document.

Read the original ↗
What does sanity-plugin-image-gen do?

It adds a "Generate image" action inside Sanity Studio so editors can turn a prompt into an image without leaving the CMS. It supports advanced options like aspect ratio, image size, the number of variants generated, and negative prompts.

Read the original ↗
Does Sanity have AI image generation built in?

Not natively. Sanity itself does not ship an image generator. The sanity-plugin-image-gen plugin from Roboto Studio bridges Sanity Studio to Replicate so you can generate images from prompts inside the editor. You bring your own Replicate API key.

Read the original ↗
Can I use Replicate with Sanity CMS?

Yes. The plugin calls the Replicate API from a Next.js API route in your app, which means any image model Replicate hosts is available from inside Sanity Studio. You can swap the underlying model and tweak the default prompt prefix to suit your house style.

Read the original ↗
Is Sanity CMS good for AI image workflows?

Sanity is well suited because its plugin model and custom input components make it easy to embed generators directly in the editing experience. With this plugin, the AI step is part of the editor's normal flow rather than a separate tool, which is what makes it useful for blogs and landing pages.

Read the original ↗

Scope and context

  • Video authors are credited by the original Roboto page; individual transcript speakers remain unassigned.