# Adding Assets

***

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

### Uploading & Referencing Local Assets

1. **Attach the file**
   * Click the **+** button under the prompt box.
   * Select **Add images & files**.
   * The **Files & Images** modal opens.
   * Stay on **Uploads** to use files you have already uploaded, or switch to **Artifacts** to reuse generated assets.
   * To add something new, click **Upload** (top right) and choose your file.
   * Once the new asset is uploaded, select it from the **Uploads** tab.&#x20;
   * Click the file thumbnail to insert it into your project.
2. **Refer to your prompt**

   ```
   Use the attached image as the hero background.
   ```
3. Maker will automatically insert or replace your project’s `<img>` with the selected asset.

***

### Using External URLs

* **Paste any public URL** (PNG, JPEG, SVG, MP4, YouTube, Vimeo) directly into the prompt.
* **Prompt example**:

  ```
  Fetch this image: https://example.com/header.png and use it as the page’s hero banner.
  Embed this YouTube video (https://youtu.be/XYZ) below the introduction.
  ```
* Maker fetches and embeds external assets at generation time.

***

### Replacing Assets in Your Project

* **Share a prompt to make any asset updates**

  ```
  In the hero banner, replace the logo with the attached image.

  ```
* **Select Tool-** Target any element in your live preview by clicking on the select tool first in the prompt box
* Maker AI updates your code to reference the new asset paths.

***

### Embedding & Configuring Videos

Add the video as noted above, then prompt like:

* Make the video autoplay and loop enabled.
* Use the video as background, muted autoplay, with a poster frame from this asset

***

### Best Practices

* **Optimize file size**: You don’t need to compress images before uploading—Maker automatically optimizes them for performance. For best visual quality, upload images at **2x the display size**. Note: there is a **5MB file size limit** per image.
* **Descriptive filenames**: When adding assets, add a description in the prompt box on how to use it
* **Match dimensions**: Use aspect ratios that fit your design.
* **Host stable links**: If you upload images directly to Maker, they’re automatically served via our CDN, ensuring fast, reliable, and consistent delivery. If you link to externally hosted assets, be sure they’re on a reliable server or CDN to avoid issues with broken or unstable links when the content is loaded or updated later.

***


---

# 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://docs.maker.co/tips-and-tricks/adding-assets.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.