Icono System
icon-park:system
El icono System (icon-park:system) es un icono SVG gratuito de la colección IconPark de ByteDance. Está dibujado en una cuadrícula de 48 × 48. IconPark icons se publican bajo la licencia Apache 2.0, que permite usarlos en proyectos personales y comerciales. Cópialo como código SVG, JSX, Vue o Svelte, o descarga el archivo SVG.
- Colección
- IconPark
- Autor
- ByteDance
- Licencia
- Apache-2.0
- Tamaño
- 48 × 48
- Categoría
- Básicos
Código SVG
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><g fill="#2F88FF" stroke="#000" stroke-linejoin="round" stroke-width="4"><path d="M18 6H8C6.89543 6 6 6.89543 6 8V18C6 19.1046 6.89543 20 8 20H18C19.1046 20 20 19.1046 20 18V8C20 6.89543 19.1046 6 18 6Z"/><path d="M18 28H8C6.89543 28 6 28.8954 6 30V40C6 41.1046 6.89543 42 8 42H18C19.1046 42 20 41.1046 20 40V30C20 28.8954 19.1046 28 18 28Z"/><path d="M35 20C38.866 20 42 16.866 42 13C42 9.13401 38.866 6 35 6C31.134 6 28 9.13401 28 13C28 16.866 31.134 20 35 20Z"/><path d="M40 28H30C28.8954 28 28 28.8954 28 30V40C28 41.1046 28.8954 42 30 42H40C41.1046 42 42 41.1046 42 40V30C42 28.8954 41.1046 28 40 28Z"/></g></svg>Cómo usar el icono System
React
import { Icon } from "@iconify/react";
<Icon icon="icon-park:system" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="icon-park:system" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="icon-park:system" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[icon-park--system]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/icon-park -->
<div class="i-icon-park:system"></div>Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="icon-park:system"></iconify-icon>Imagen HTML
<img src="https://iconyz.com/api/public/svg/icon-park/system.svg" alt="Icono System" width="24" height="24">El icono System en otras colecciones
Preguntas frecuentes sobre Icono System
¿El icono System es gratis para uso comercial?
Sí. IconPark icons se publican bajo la licencia Apache 2.0, que permite usarlos en proyectos personales y comerciales.
¿Cómo uso el icono System en React?
Instala @iconify/react y renderiza <Icon icon="icon-park:system" />, o usa «Copiar código» en esta página para obtener un componente de React independiente.
¿Cómo añado el icono System a una página web?
Enlaza el archivo SVG en una etiqueta de imagen: <img src="https://iconyz.com/api/public/svg/icon-park/system.svg" alt="Icono System">, o pega el código SVG en línea para darle estilo con CSS.