# Adding Midjourney Images

[Midjourney](https://www.midjourney.com/) is a powerful creative engine that allows users to generate high-quality, visually compelling images using nothing more than natural language prompts. While these images are striking on their own, their true potential shines when they’re used in dynamic web interfaces.

This guide will walk you through how to seamlessly integrate a [Midjourney](https://www.midjourney.com/) generated image into a web-based tool using Dualite. Whether you're designing a product showcase, a personal portfolio, or a landing page, Dualite makes it effortless to blend aesthetic visuals with functional layouts.

### Why Use Midjourney Images in Dualite? 

[Midjourney](https://www.midjourney.com/) offers unmatched creative freedom, producing stunning imagery that feels artistic, cinematic, or hyper-realistic, depending on your prompt. When paired with Dualite, these images don’t just sit on a canvas, they become a part of your product, driving user experience and interaction.

Here’s what you get when you combine the two:

* AI-generated imagery tailored to your exact vision
* Fast, code-free implementation into responsive UI
* Clean layout integration (as backgrounds, cards, hero banners, etc.)
* Built-in optimisation for quality and load performance

<figure><img src="/files/TftbQLWONRfbgeQleIaW" alt=""><figcaption></figcaption></figure>

### Integrating Midjourney Images on Dualite

Before you begin, ensure that you’ve already generated your image in [Midjourney](https://www.midjourney.com/) and have access to Dualite

#### Step 1: Generate an Image Using Midjourney

Start by creating an image using a prompt on Midjourney’s platform. Once the image is generated and you're happy with the result:

* Right-click on the image
* Select “Copy Image URL”&#x20;

This copied URL will be used as input in your prompt.

<figure><img src="/files/8lAmJF8ykW8UlVe8Xuwu" alt=""><figcaption></figcaption></figure>

#### Step 2: Craft a Prompt in Dualite

Now open Dualite. In the prompt field:

* Paste the [Midjourney](https://www.midjourney.com/) image URL
* Describe your intended use of the image
* Specify any layout needs (e.g., “use as hero background,” “embed in a product card,” etc.)

Example prompt:

“Create a modern and responsive landing page for an art showcase. Use this [Midjourney](https://www.midjourney.com/) image <https://cdn.midjourney.com/80e9e245-ca0b-4c28-ac4c-80ae6c1c90ef/0_1.png> as the hero section background. The image should span full width, maintain high quality, and have a slight overlay to support text visibility.”

Dualite will take your input and design the layout accordingly, optimising the image and placing it exactly where and how you describe.

<figure><img src="/files/u2Yurc4wdpYNTlSbPww8" alt=""><figcaption></figcaption></figure>

#### Step 3: Let Dualite Build and then Publish

Once the prompt is submitted, Dualite handles all technical aspects:

* Embeds the image at the correct position
* Maintains visual fidelity across screen sizes
* Optimises load time for better performance
* Applies any design effects (like blur, opacity, overlays) if mentioned

When the layout is ready, you can immediately deploy your web tool or landing page. Dualite enables real-time preview and one-click publishing, giving you a shareable, production-ready interface within minutes. Simply click the Publish button located at the top right corner of the screen to make your project live.

<figure><img src="/files/AU9JGQqo3ByANTP7G3eE" alt=""><figcaption></figcaption></figure>

### Conclusion

Incorporating Midjourney images into Dualite projects is a simple yet powerful way to bring artistic depth to your web tools. With just an image URL and a thoughtfully written prompt, you can build interactive, visually refined web pages that go beyond basic design.\
Whether you're an artist, marketer, or startup founder, this integration unlocks a new level of visual storytelling crafted by AI and deployed effortlessly.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://alphadocs.dualite.dev/tips-and-techniques/adding-midjourney-images.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.