Ikon Tailwindcss
logos:tailwindcss
Ikon Tailwindcss (logos:tailwindcss) adalah ikon SVG gratis dari set SVG Logos karya Gil Barbara. Ikon ini digambar pada grid 512 × 64. SVG Logos icons dirilis di bawah lisensi CC0, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial. Salin sebagai kode SVG, JSX, Vue, atau Svelte, atau unduh file SVG-nya.
- Set ikon
- SVG Logos
- Pembuat
- Gil Barbara
- Lisensi
- CC0-1.0
- Ukuran
- 512 × 64
Kode SVG
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="64" viewBox="0 0 512 64"><defs><linearGradient id="SVGJSB7ld0l" x1="-2.778%" x2="100%" y1="32%" y2="67.556%"><stop offset="0%" stop-color="#2298bd"/><stop offset="100%" stop-color="#0ed7b5"/></linearGradient></defs><path fill="url(#SVGJSB7ld0l)" d="M52.867 0Q31.72 0 26.433 21.147q7.93-10.575 18.504-7.93c4.021 1.005 6.896 3.923 10.078 7.153c5.183 5.26 11.182 11.35 24.285 11.35q21.147 0 26.433-21.147q-7.93 10.575-18.503 7.93c-4.022-1.005-6.896-3.923-10.078-7.153C71.968 6.09 65.97 0 52.867 0M26.433 31.72Q5.287 31.72 0 52.867q7.93-10.575 18.503-7.93c4.022 1.005 6.897 3.923 10.078 7.152c5.184 5.262 11.183 11.35 24.286 11.35q21.146 0 26.433-21.146q-7.93 10.575-18.503 7.93C56.775 49.218 53.9 46.3 50.718 43.07c-5.183-5.26-11.182-11.35-24.285-11.35"/><path fill="#2d3748" d="M158.592 26.73h-9.226v17.858c0 4.762 3.125 4.688 9.226 4.39v7.217c-12.351 1.488-17.262-1.934-17.262-11.607V26.731h-6.845v-7.738h6.845V8.999l8.036-2.38v12.374h9.226zm35.17-7.737h8.036v37.202h-8.036v-5.357c-2.827 3.944-7.217 6.325-13.02 6.325c-10.12 0-18.528-8.557-18.528-19.569c0-11.086 8.408-19.568 18.527-19.568c5.804 0 10.194 2.38 13.021 6.25zm-11.756 30.506c6.696 0 11.756-4.985 11.756-11.905s-5.06-11.905-11.756-11.905s-11.756 4.985-11.756 11.905s5.06 11.905 11.756 11.905m33.185-36.087c-2.828 0-5.134-2.38-5.134-5.133a5.144 5.144 0 0 1 5.134-5.134a5.144 5.144 0 0 1 5.134 5.134c0 2.753-2.307 5.133-5.134 5.133m-4.018 42.783V18.993h8.035v37.202zm17.336 0V1.88h8.036v54.315zm60.194-37.202h8.482l-11.682 37.202h-7.887l-7.738-25.074l-7.812 25.074h-7.887l-11.682-37.202h8.482l7.218 25.67l7.812-25.67h7.664l7.738 25.67zm18.452-5.58c-2.827 0-5.134-2.381-5.134-5.134a5.144 5.144 0 0 1 5.134-5.134a5.144 5.144 0 0 1 5.134 5.134c0 2.753-2.307 5.133-5.134 5.133m-4.018 42.782V18.993h8.036v37.202zm36.905-38.17c8.333 0 14.286 5.655 14.286 15.328v22.842h-8.036V34.171c0-5.654-3.274-8.63-8.333-8.63c-5.283 0-9.45 3.124-9.45 10.714v19.94h-8.036V18.993h8.036v4.762c2.456-3.87 6.473-5.73 11.533-5.73m52.381-13.913h8.036v52.083h-8.036v-5.357c-2.827 3.944-7.217 6.325-13.02 6.325c-10.12 0-18.528-8.557-18.528-19.569c0-11.086 8.408-19.568 18.527-19.568c5.804 0 10.194 2.38 13.021 6.25zm-11.756 45.387c6.696 0 11.756-4.985 11.756-11.905s-5.06-11.905-11.756-11.905s-11.756 4.985-11.756 11.905s5.06 11.905 11.756 11.905m46.726 7.664c-11.235 0-19.643-8.557-19.643-19.569c0-11.086 8.408-19.568 19.643-19.568c7.292 0 13.616 3.794 16.593 9.598l-6.92 4.018c-1.637-3.497-5.283-5.73-9.747-5.73c-6.548 0-11.533 4.986-11.533 11.682s4.985 11.682 11.533 11.682c4.464 0 8.11-2.307 9.896-5.73l6.92 3.944c-3.126 5.878-9.45 9.673-16.742 9.673m29.985-27.902c0 6.77 20.015 2.678 20.015 16.443c0 7.44-6.473 11.459-14.509 11.459c-7.44 0-12.797-3.349-15.178-8.706l6.92-4.018c1.19 3.349 4.166 5.357 8.258 5.357c3.572 0 6.325-1.19 6.325-4.166c0-6.622-20.015-2.902-20.015-16.22c0-6.995 6.027-11.384 13.616-11.384c6.101 0 11.16 2.827 13.765 7.738l-6.77 3.794c-1.34-2.901-3.944-4.24-6.995-4.24c-2.902 0-5.432 1.264-5.432 3.943m34.301 0c0 6.77 20.015 2.678 20.015 16.443c0 7.44-6.473 11.459-14.509 11.459c-7.44 0-12.798-3.349-15.179-8.706l6.92-4.018c1.19 3.349 4.167 5.357 8.259 5.357c3.571 0 6.324-1.19 6.324-4.166c0-6.622-20.014-2.902-20.014-16.22c0-6.995 6.026-11.384 13.616-11.384c6.1 0 11.16 2.827 13.765 7.738l-6.771 3.794c-1.34-2.901-3.944-4.24-6.994-4.24c-2.902 0-5.432 1.264-5.432 3.943"/></svg>Cara memakai ikon Tailwindcss
React
import { Icon } from "@iconify/react";
<Icon icon="logos:tailwindcss" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="logos:tailwindcss" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="logos:tailwindcss" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--tailwindcss]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:tailwindcss"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="logos:tailwindcss"></iconify-icon>Gambar HTML
<img src="https://iconyz.com/api/public/svg/logos/tailwindcss.svg" alt="Ikon Tailwindcss" width="24" height="24">Ikon terkait di SVG Logos
Ikon Tailwindcss di set ikon lain
FAQ Ikon Tailwindcss
Apakah ikon Tailwindcss gratis untuk penggunaan komersial?
Ya. SVG Logos icons dirilis di bawah lisensi CC0, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial.
Bagaimana cara memakai ikon Tailwindcss di React?
Pasang @iconify/react lalu render <Icon icon="logos:tailwindcss" />, atau gunakan “Salin kode” di halaman ini untuk mendapatkan komponen React mandiri.
Bagaimana cara menambahkan ikon Tailwindcss ke halaman web?
Tautkan file SVG di tag gambar: <img src="https://iconyz.com/api/public/svg/logos/tailwindcss.svg" alt="Ikon Tailwindcss">, atau tempel kode SVG langsung di halaman untuk menatanya dengan CSS.