New
New
New
Website
AI No-Code Hero Section in Framer
This is a hero section created with AI and no-code (Framer). I used Midjourney for creating the hero image with the help of a reference image. Read more below to learn how you can generate such images for your hero section with AI.
Created by
About the resource
I've seen so many hero sections lately with stunning AI imagery that I started feeling like there's a new web design trend emerging right in front of our eyes. So I went ahead and cracked the code to see how something like this could be created in Midjourney.
About the resource
I've seen so many hero sections lately with stunning AI imagery that I started feeling like there's a new web design trend emerging right in front of our eyes. So I went ahead and cracked the code to see how something like this could be created in Midjourney.
About the resource
I've seen so many hero sections lately with stunning AI imagery that I started feeling like there's a new web design trend emerging right in front of our eyes. So I went ahead and cracked the code to see how something like this could be created in Midjourney.
Few inspirations I've seen on Twitter.
Few inspirations I've seen on Twitter.
Few inspirations I've seen on Twitter.
Generating the image
First, I went onto Google and searched for a reference image. I typed in "studio ghibli style illustration." What I was looking for is an image that I can use as a style reference for our generated image.
Generating the image
First, I went onto Google and searched for a reference image. I typed in "studio ghibli style illustration." What I was looking for is an image that I can use as a style reference for our generated image.
Generating the image
First, I went onto Google and searched for a reference image. I typed in "studio ghibli style illustration." What I was looking for is an image that I can use as a style reference for our generated image.
I ended up finding this image.
I ended up finding this image.
I ended up finding this image.
Then, I opened up Midjourney and used the [subject] + [action] + [environment] + [art style] framework for my prompt.
So my final prompt ended up being: "a small character / on adventure gazing out / over a landscape with a huge cyberpunk city with skyscrapers / studio ghibli art style / --sref https://s.mj.run/VsO95jYBQxQ --ar 16:10."
You noticed that I use --sref at the end with a link to my reference image. This is how I add style reference to my prompt. The "--ar 16:10" at the very end sets the aspect ratio.
After the first generation, I iterated multiple times, generating variations of different images, and zooming out of them to expand the scene.
Then, I opened up Midjourney and used the [subject] + [action] + [environment] + [art style] framework for my prompt.
So my final prompt ended up being: "a small character / on adventure gazing out / over a landscape with a huge cyberpunk city with skyscrapers / studio ghibli art style / --sref https://s.mj.run/VsO95jYBQxQ --ar 16:10."
You noticed that I use --sref at the end with a link to my reference image. This is how I add style reference to my prompt. The "--ar 16:10" at the very end sets the aspect ratio.
After the first generation, I iterated multiple times, generating variations of different images, and zooming out of them to expand the scene.
Then, I opened up Midjourney and used the [subject] + [action] + [environment] + [art style] framework for my prompt.
So my final prompt ended up being: "a small character / on adventure gazing out / over a landscape with a huge cyberpunk city with skyscrapers / studio ghibli art style / --sref https://s.mj.run/VsO95jYBQxQ --ar 16:10."
You noticed that I use --sref at the end with a link to my reference image. This is how I add style reference to my prompt. The "--ar 16:10" at the very end sets the aspect ratio.
After the first generation, I iterated multiple times, generating variations of different images, and zooming out of them to expand the scene.
My full prompting process.
My full prompting process.
My full prompting process.
You can see that I ended up with my final images after multiple rounds of variations and zoom-outs. You should also feel free to tweak your prompt and keep regenerating until you find something that you like.
You can see that I ended up with my final images after multiple rounds of variations and zoom-outs. You should also feel free to tweak your prompt and keep regenerating until you find something that you like.
You can see that I ended up with my final images after multiple rounds of variations and zoom-outs. You should also feel free to tweak your prompt and keep regenerating until you find something that you like.
