Adding an image in Codepen w/a relative link


I’m finishing my Survey Page project in Codepen. I don’t have an absolute url for the image I would like to use for my background. How do I use the image file with only a relative link?

Hi @Nreynolds1202,

If you use the free version of CodePen, you need to have the image accessible somewhere. You can use GitHub for example (tuto: or Google Photos (I saw someone here use this service).

There is other ways and maybe someone knows a better solution.


CodePen pens do not include asset hosting. I believe that the “projects” feature does include asset hosting, but that is not included in the free plan. You will need to host your image online; a website can’t see it if it’s only on your personal computer. If you google “free image hosting” you’ll find a bunch of services that do this.

1 Like

Ah! Thank you! I’ll check this out.

Ok, thanks for explaining that. Thanks and I’ll do that.


If you just want to host a few images, is fine, but there are some contradictions of usage when using IMGUR for CODEPEN, and the Images can be removed for a breach of the Terms of service. when being used to host An Image Library for Codepen or Websites.

I think you can still use for Hosting, but the linking from there is a little more complex.

1 Like

You can use GitHub as well.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.