How To Add A Image Into CodePen?

Upload the image to an image host or use a direct image URL

In CodePen, open your Pen

Add the image in the HTML panel with an `` tag

Set the `src` attribute to the image URL

Add an `alt` attribute

Example: `Image`

Or use CSS to add it as a background image

Example: `background-image: url(“https://example.com/image.jpg”);`

If using a local image, upload it to CodePen Assets or another hosting service

Copy the asset URL and paste it into your code

Save the Pen to keep the image linked

Suggested for You

Trending Today