2
0
mirror of https://github.com/iconify/iconify.git synced 2024-12-14 06:28:24 +00:00
iconify/plugins-demo/tailwind-demo/src/index.html
2023-04-20 19:35:07 +03:00

43 lines
1.1 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="../dist/output.css" rel="stylesheet" />
</head>
<body class="m-0 p-2">
<p>
Few icons that change color on hover (first icon also changes icon
on hover):
<span class="text-3xl demo">
<span
class="icon-[mdi-light--arrow-left] hover:icon-hover-[mdi-light--arrow-right]"
></span>
<span class="icon-[mdi-light--forum]"></span>
</span>
</p>
<p>
Custom icons, imported from "svg" directory:
<span class="text-3xl demo">
<span class="icon-[custom--spinner1]"></span>
<span class="icon-[custom--spinner2]"></span>
</span>
</p>
<p>
Icons with hardcoded palette:
<span class="text-3xl demo">
<span
class="icon-[vscode-icons--file-type-access] hover:icon-hover-[vscode-icons--file-type-access2]"
></span>
<span class="icon-[vscode-icons--file-type-vue]"></span>
</span>
</p>
<p>
Clean selector:
<span
class="icon--mdi-light icon--mdi-light--home text-3xl demo"
></span>
</p>
</body>
</html>