Link Tags in HTML

From the HTML cheat sheet · Document Structure & Metadata · verified Jul 2026

Link Tags

Link external resources and define relationships

html
<!-- Stylesheets -->
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="print.css" media="print">

<!-- Favicon -->
<link rel="icon" href="/favicon.ico">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">

<!-- Preloading resources -->
<link rel="preload" href="font.woff2" as="font" crossorigin>
<link rel="prefetch" href="next-page.html">
<link rel="dns-prefetch" href="https://api.example.com">
💡 preload for critical resources needed soon
📌 prefetch for resources needed later
⚡ preconnect speeds up external connections
🟢 Essential for performance optimization
⚠️ Too many preloads can hurt performance
linkresourcesperformance

More HTML tasks

Back to the full HTML cheat sheet