Clickable image: How to link HTML image to URL
You can make an image clickable by wrapping the image html tag(<img>
) with link html tag(<a></a>
).
First, start off by adding an image using HTML.
code:
<img class="linked-image" src=" https://clickable-image.avicnotes.repl.co/drone-in-flight.jpg " alt="Flying drone with camera">
Wrap the image with a link:
code:
<a href="https://devpractical.com/blog/">
<img class="linked-image" src=" https://clickable-image.avicnotes.repl.co/drone-in-flight.jpg" alt="Flying drone with camera">
</a>
You can view the image online and see if you can click on it.
Result:
Link HTML image to Own URL
Sometimes, you want the same image to be loaded when clicked.
Use the same url you used on the <img>
html tag.
Code:
<a href=" https://clickable-image.avicnotes.repl.co/drone-in-flight.jpg">
<img class="linked-image" src=" https://clickable-image.avicnotes.repl.co/drone-in-flight.jpg" alt="Flying drone with camera">
</a>
Link HTML image to a Different URL
Using the same link tag, we can add URL to any relevant website or webpage we want.
Code:
<a href="https://devpractical.com/blog/">
<img class="linked-image" src=" https://clickable-image.avicnotes.repl.co/drone-in-flight.jpg" alt="Flying drone with camera">
</a>
If you click on the image above, you will be directed to https://devpractical.com/blog/
Remove border around clickable image
Incase you notice a weird border around the image on some browsers, use CSS to remove the border. HTML code:
<a href="https://devpractical.com/blog/">
<img class="linked-image" src="=" https://clickable-image.avicnotes.repl.co/drone-in-flight.jpg " alt="Flying drone with camera">
</a>
CSS code:
.linked-image {
border: none;
}
You can play around and test this code on Replit

Hi there! I am Avic Ndugu.
I have published 100+ blog posts on HTML, CSS, Javascript, React and other related topics. When I am not writing, I enjoy reading, hiking and listening to podcasts.
Front End Developer Newsletter
Receive a monthly Frontend Web Development newsletter.
Never any spam, easily unsubscribe any time.