---
sourceDocument: Xanadu ServiceNow AI Platform Administration
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/xanadu/platform-administration

 Release :

    - xanadu

ft:locale :

    - en-US

ft:publication_title :

    - Xanadu ServiceNow AI Platform Administration

ft:clusterId :

    - platadm

bundleId :

    - platadm

workflow :

    - Platform


---

# Embed images in the HTML editor

# Embed images in the HTML editor {#ariaid-title1}

* Release version: Xanadu
* 
* Updated August 1, 2024
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 2 minutes to read

You can use the HTML field image picker to embed images into HTML fields, and to add
images to the image library.

## Before you begin

Role required: the role necessary to update the record that contains the HTML field. For example, any user with a role can create a knowledge article and embed an image in it.

## About this task

Note:  
Administrators and users with the image_admin role manage the image library at System UIImages. See [Storing images in the database](https://www.servicenow.com/docs/access?context=c_StoringImagesInTheDatabase&version=xanadu&pubname=xanadu-platform-user-interface&ft:locale=en-US) .

## Procedure

1. Open the form that contains the HTML field.
2. Click the position where the image is to appear, or to modify an existing image, click the image.
3. Click the insert/edit image icon (![Insert or edit image icon]()) on the HTML editor toolbar.
4. In the Insert/Modify image form, enter information in each field.  
   {#t_EmbeddingImagesInHTMLFields__table_insert_modify_fields__entry__2}

   | Field | Description |
   |-|-|
   | Type | Select the image type. * Image Library: Images stored in the db_image table. You can reuse images in the image library in multiple locations. * Attachment: Available in the current record only {#t_EmbeddingImagesInHTMLFields__ul_pwx_24k_q4} |
   | Image | Begin typing a file name and select an image from the list, or click the reference lookup icon and select an image. To upload a new image, click New, click Choose File, locate the image, and click Upload. If you chose the Attachment type, click Choose File, locate the image, and click Attach. |
   | Tooltip | Enter alternate text that appears when a user points to the image. |
   | Alt | Enter alternate text that can be used to improve accessibility. For example, it could be used with a screen reader. If this field is left blank, it defaults to the text entered in the Tooltip field. |
   [Table 1. Insert/Modify Image form]

   {#t_EmbeddingImagesInHTMLFields__table_insert_modify_fields}  
   Note:  
   To resize an embedded image, click the image. The sizing frame appears. Drag a sizing point until the image is the desired size. Corner points adjust the size proportionally. Depending on your browser, you may need to highlight the image before the sizing frame appears.
5. **Optional:** To provide additional control over the appearance of an image, click Advanced options.  
   {#t_EmbeddingImagesInHTMLFields__table_rbt_131_rt__entry__2}

   | Field | Description |
   |-|-|
   | Layout | Select the image Alignment (default is Baseline) and enter the Border thickness. |
   | Spacing | Enter the number of Horizontal and Vertical pixels around the image. |
   | Size | Enter the Width and Height of the image (in pixels). |
   [Table 2. Advanced options]

   {#t_EmbeddingImagesInHTMLFields__table_rbt_131_rt}
6. Click OK.
7. **Optional:** Paste an image into the HTML editor.  
   To edit the image, save the entry then select the image. Click the insert/edit image icon and complete the form using the same tables for adding an image.

   Pasted images are saved in the system as attachments.

*[\>]: and then