ICONYZ
Bahasa Indonesia
Ikon Codepen dari SVG Logos

Ikon Codepen

logos:codepen

Ikon Codepen (logos:codepen) adalah ikon SVG gratis dari set SVG Logos karya Gil Barbara. Ikon ini digambar pada grid 512 × 95. 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 × 95
Download SVG

Kode SVG

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="95" viewBox="0 0 512 95"><path d="M9.17 24.813c12.225-12.31 32.093-12.444 44.485-.303a4.454 4.454 0 1 1-6.234 6.363c-8.895-8.715-23.156-8.618-31.932.217s-8.775 23.097 0 31.932c8.776 8.836 23.037 8.933 31.932.218a4.454 4.454 0 0 1 6.234 6.362C41.263 81.744 21.395 81.61 9.17 69.3s-12.225-32.178 0-44.487M119.963.009l.136-.007h.282l.255.015l.281.033l.12.02l.21.042l.225.059q.328.093.634.233l.22.109l.209.117l.178.113L165.296 29q.385.25.717.585l.115.12l.087.098l.127.153l.185.25l.1.154l.123.208l.098.188l.091.197q.221.505.308 1.035l.006.04q.05.312.054.625v28.75a4.4 4.4 0 0 1-.284 1.552l-.02.047a4 4 0 0 1-.162.368l-.119.222l-.173.28l-.086.123l-.156.203l-.143.167l-.143.152q-.344.35-.75.61l-42.53 28.224c-.432.292-.92.51-1.442.637l-.276.056l-.258.038l-.336.026l-.178.004q-.132 0-.261-.008l-.325-.03l-.2-.032a4.4 4.4 0 0 1-1.267-.43l-.026-.015a4 4 0 0 1-.445-.27L75.162 65.083a4 4 0 0 1-.343-.255l-.184-.16l-.178-.174l-.231-.257l-.13-.164l-.143-.2a5 5 0 0 1-.151-.241l-.133-.245l-.105-.223a4.4 4.4 0 0 1-.37-1.77V32.706c.002-.51.092-1.023.273-1.516l.118-.287l.034-.074l.107-.212l.107-.187l.12-.19l.09-.127l.14-.184l.15-.176l.153-.163l.16-.153q.28-.256.592-.457L117.75.768l.205-.132l.238-.132l.218-.106l.207-.088a4.4 4.4 0 0 1 1-.265zM98.949 52.424L85.666 61.36l30.13 19.994V63.757zm42.602-.001l-16.847 11.334v17.597l30.13-19.995zm-21.3-14.329l-13.32 8.961l13.32 8.96l13.32-8.961zm-38.153 2.993v11.937l8.872-5.969zm76.297.005l-8.864 5.963l8.864 5.964zm-42.599-28.34L85.664 32.75l13.286 8.937l16.846-11.333zm8.908.004v17.598l16.846 11.333l13.286-8.937zm88.498 2.736h-19.365a4.454 4.454 0 0 0-4.454 4.454v54.221a4.454 4.454 0 0 0 4.454 4.454h19.365c17.433 0 31.564-14.132 31.564-31.565c0-17.432-14.131-31.564-31.564-31.564m-14.915 54.221V24.4h14.915c12.513 0 22.657 10.143 22.657 22.656s-10.144 22.657-22.657 22.657zM302.28 15.492a4.454 4.454 0 0 1 .485 8.881l-.485.027h-30.407v18.202h18.788a4.454 4.454 0 0 1 .485 8.882l-.485.026h-18.789l.001 18.203h30.407a4.455 4.455 0 0 1 4.428 3.969l.026.485a4.455 4.455 0 0 1-3.969 4.428l-.485.026h-34.857a4.455 4.455 0 0 1-4.428-3.969l-.026-.485V19.946a4.455 4.455 0 0 1 3.969-4.428l.485-.026zm54.221 0c11.016 0 19.946 8.93 19.946 19.945c0 10.734-8.478 19.487-19.103 19.929l-.843.017h-18.788l.004 18.784a4.455 4.455 0 0 1-3.968 4.428l-.486.026a4.455 4.455 0 0 1-4.427-3.969l-.027-.485V19.946a4.455 4.455 0 0 1 3.97-4.428l.484-.026zm-18.788 30.983h18.788c6.096 0 11.038-4.941 11.038-11.038c0-5.878-4.595-10.683-10.39-11.019l-.648-.018h-18.788zm96.247-30.983a4.454 4.454 0 0 1 .485 8.881l-.485.027h-30.406l-.001 18.202h18.788a4.454 4.454 0 0 1 .486 8.882l-.486.026h-18.788v18.203h30.407a4.455 4.455 0 0 1 4.428 3.969l.026.485a4.455 4.455 0 0 1-3.969 4.428l-.485.026h-34.856a4.455 4.455 0 0 1-4.428-3.969l-.026-.485V19.946a4.455 4.455 0 0 1 3.968-4.428l.486-.026zm26.53 4.454c0-4.073 4.954-5.938 7.655-3.1l.3.348l34.643 44.092l.004-41.34a4.455 4.455 0 0 1 3.969-4.428l.485-.026a4.455 4.455 0 0 1 4.428 3.968l.026.486v54.221c0 4.073-4.954 5.937-7.655 3.1l-.301-.348l-34.65-44.1l.004 41.348a4.455 4.455 0 0 1-3.969 4.428l-.485.026a4.455 4.455 0 0 1-4.428-3.969l-.026-.485z"/></svg>

Cara memakai ikon Codepen

React

import { Icon } from "@iconify/react";

<Icon icon="logos:codepen" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="logos:codepen" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="logos:codepen" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--codepen]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:codepen"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="logos:codepen"></iconify-icon>

Gambar HTML

<img src="https://iconyz.com/api/public/svg/logos/codepen.svg" alt="Ikon Codepen" width="24" height="24">

Ikon terkait di SVG Logos

Ikon Codepen di set ikon lain

FAQ Ikon Codepen

Apakah ikon Codepen 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 Codepen di React?

Pasang @iconify/react lalu render <Icon icon="logos:codepen" />, atau gunakan “Salin kode” di halaman ini untuk mendapatkan komponen React mandiri.

Bagaimana cara menambahkan ikon Codepen ke halaman web?

Tautkan file SVG di tag gambar: <img src="https://iconyz.com/api/public/svg/logos/codepen.svg" alt="Ikon Codepen">, atau tempel kode SVG langsung di halaman untuk menatanya dengan CSS.

Lihat semua Ikon SVG Logos →