Ir al contenido
SVG Nexus Iconos vectoriales y 3D
3d MIT 9 nodos vectoriales
Keycap - Fluent UI Emoji iconFree Keycap vector icon from the Fluent UI Emoji open-source icon library; 3d style, MIT licence, viewBox 0 0 32 32, 6873 bytes.
viewBox 0 0 32 32 Estático
1. Color

Los colores originales del icono se mantienen hasta que elijas un color nuevo.

2. Fondo del lienzo y transformaciones
3. Ajustes de animación vectorial en vivo Incluido en la exportación SVG
Editar en el editor SVG Abrir el estudio vectorial
Fluent UI Emoji | Iconos vectoriales 3D | viewBox="0 0 32 32" | Gratis para uso comercial

Icono SVG de Keycap

La fuente, el autor y la licencia estan en la vista previa y en el detalle del icono. Keycap - Gratis para uso comercial y personal. Sin Registro | 100% en tu Navegador

Descargas instantaneas vectoriales y de alta resolución
Los colores originales del icono se mantienen hasta que elijas un color nuevo. Paquete con créditos fluentui-emoji-keycap-4.svg (7.237 B)
Copia rápida para desarrolladores y frameworks de interfaz
Salida de código en vivo 
<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" width="36" height="36" role="img" aria-label="Keycap icon"><title>Keycap - Fluent UI Emoji icon</title><desc>Free Keycap vector icon from the Fluent UI Emoji open-source icon library; 3d style, MIT licence, viewBox 0 0 32 32, 6873 bytes.</desc>
<g filter="url(#nx17903_filter0_ii_18590_3314)">
<rect x="2.28931" y="2.4375" width="27.875" height="27.875" rx="3.6" fill="url(#nx17903_paint0_linear_18590_3314)"/>
<rect x="2.28931" y="2.4375" width="27.875" height="27.875" rx="3.6" fill="url(#nx17903_paint1_radial_18590_3314)"/>
</g>
<g filter="url(#nx17903_filter1_f_18590_3314)">
<path d="M28.4768 4.9375V27.8125" stroke="url(#nx17903_paint2_linear_18590_3314)" stroke-width="1.5" stroke-linecap="round"/>
</g>
<g filter="url(#nx17903_filter2_f_18590_3314)">
<path d="M5.75317 4.25H27.5344" stroke="url(#nx17903_paint3_linear_18590_3314)" stroke-width="1.5" stroke-linecap="round"/>
</g>
<g filter="url(#nx17903_filter3_f_18590_3314)">
<path d="M14.84 8.23745C15.7778 8.47126 16.3485 9.42103 16.1147 10.3588L14.8537 15.4163C14.838 15.4794 14.8857 15.5405 14.9508 15.5405H16.622C16.6773 15.5405 16.722 15.4957 16.722 15.4405V14.4354C16.722 13.4689 17.5055 12.6854 18.472 12.6854C19.4385 12.6854 20.222 13.4689 20.222 14.4354V15.4941C20.222 15.5416 20.2556 15.5823 20.3017 15.5939C21.0599 15.7859 21.6209 16.4727 21.6209 17.2905C21.6209 18.1083 21.0599 18.7951 20.3017 18.9871C20.2556 18.9987 20.222 19.0394 20.222 19.0869V22.8149C20.222 23.7814 19.4385 24.5649 18.472 24.5649C17.5055 24.5649 16.722 23.7814 16.722 22.8149V19.1405C16.722 19.0853 16.6773 19.0405 16.622 19.0405H12.5829C12.0442 19.0405 11.5355 18.7924 11.2039 18.3679C10.8722 17.9434 10.7546 17.3898 10.8849 16.8671L12.7186 9.51212C12.9524 8.57433 13.9022 8.00364 14.84 8.23745Z" fill="#579FFF"/>
</g>
<g filter="url(#nx17903_filter4_ii_18590_3314)">
<path d="M14.84 8.23745C15.7778 8.47126 16.3485 9.42103 16.1147 10.3588L14.8537 15.4163C14.838 15.4794 14.8857 15.5405 14.9508 15.5405H16.622C16.6773 15.5405 16.722 15.4957 16.722 15.4405V14.4354C16.722 13.4689 17.5055 12.6854 18.472 12.6854C19.4385 12.6854 20.222 13.4689 20.222 14.4354V15.4941C20.222 15.5416 20.2556 15.5823 20.3017 15.5939C21.0599 15.7859 21.6209 16.4727 21.6209 17.2905C21.6209 18.1083 21.0599 18.7951 20.3017 18.9871C20.2556 18.9987 20.222 19.0394 20.222 19.0869V22.8149C20.222 23.7814 19.4385 24.5649 18.472 24.5649C17.5055 24.5649 16.722 23.7814 16.722 22.8149V19.1405C16.722 19.0853 16.6773 19.0405 16.622 19.0405H12.5829C12.0442 19.0405 11.5355 18.7924 11.2039 18.3679C10.8722 17.9434 10.7546 17.3898 10.8849 16.8671L12.7186 9.51212C12.9524 8.57433 13.9022 8.00364 14.84 8.23745Z" fill="#FCF2FF"/>
</g>
<defs>
<filter id="nx17903_filter0_ii_18590_3314" x="2.28931" y="1.4375" width="28.875" height="28.875" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dx="1" dy="-1"/>
<feGaussianBlur stdDeviation="1.5"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 0.188235 0 0 0 0 0.470588 0 0 0 0 0.843137 0 0 0 1 0"/>
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_18590_3314"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dy="-1"/>
<feGaussianBlur stdDeviation="1.5"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 0.27451 0 0 0 0 0.34902 0 0 0 0 0.8 0 0 0 1 0"/>
<feBlend mode="normal" in2="effect1_innerShadow_18590_3314" result="effect2_innerShadow_18590_3314"/>
</filter>
<filter id="nx17903_filter1_f_18590_3314" x="25.7268" y="2.1875" width="5.5" height="28.375" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="1" result="effect1_foregroundBlur_18590_3314"/>
</filter>
<filter id="nx17903_filter2_f_18590_3314" x="3.00317" y="1.5" width="27.2812" height="5.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="1" result="effect1_foregroundBlur_18590_3314"/>
</filter>
<filter id="nx17903_filter3_f_18590_3314" x="9.83289" y="7.18506" width="12.788" height="18.3799" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feGaussianBlur stdDeviation="0.5" result="effect1_foregroundBlur_18590_3314"/>
</filter>
<filter id="nx17903_filter4_ii_18590_3314" x="9.83289" y="7.78506" width="12.188" height="17.7799" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
<feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dx="-1" dy="1"/>
<feGaussianBlur stdDeviation="1"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 0.866667 0 0 0 0 0.819608 0 0 0 0 0.941176 0 0 0 1 0"/>
<feBlend mode="normal" in2="shape" result="effect1_innerShadow_18590_3314"/>
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
<feOffset dx="0.4" dy="-0.4"/>
<feGaussianBlur stdDeviation="0.5"/>
<feComposite in2="hardAlpha" operator="arithmetic" k2="-1" k3="1"/>
<feColorMatrix type="matrix" values="0 0 0 0 1 0 0 0 0 0.988235 0 0 0 0 1 0 0 0 1 0"/>
<feBlend mode="normal" in2="effect1_innerShadow_18590_3314" result="effect2_innerShadow_18590_3314"/>
</filter>
<linearGradient id="nx17903_paint0_linear_18590_3314" x1="16.2268" y1="6.01201" x2="16.2268" y2="39.2647" gradientUnits="userSpaceOnUse">
<stop stop-color="#5CB7FF"/>
<stop offset="1" stop-color="#4878DD"/>
</linearGradient>
<radialGradient id="nx17903_paint1_radial_18590_3314" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(27.9456 4.53125) rotate(136.771) scale(2.14444 2.50466)">
<stop stop-color="#7BD7FF"/>
<stop offset="1" stop-color="#7BD7FF" stop-opacity="0"/>
</radialGradient>
<linearGradient id="nx17903_paint2_linear_18590_3314" x1="28.9768" y1="4.9375" x2="28.9768" y2="27.8125" gradientUnits="userSpaceOnUse">
<stop stop-color="#7FD9FF"/>
<stop offset="1" stop-color="#639DF4"/>
</linearGradient>
<linearGradient id="nx17903_paint3_linear_18590_3314" x1="28.6907" y1="4.50002" x2="3.15942" y2="4.50002" gradientUnits="userSpaceOnUse">
<stop stop-color="#7DD8FF"/>
<stop offset="1" stop-color="#5DB6FF"/>
</linearGradient>
</defs>
</svg>
Prompt de IA y mejora vectorial

Quieres mejorar o cambiar el estilo de este icono? Keycap

Genera un prompt de ingenieria preciso o mejora el icono en el lienzo ahora mismo. Keycap

Abrir en el generador de iconos con IA
Generador de prompts 100% en el navegador
Icono SVG Keycap - Fluent UI Emoji (MIT)
Verificación de fuente y licencia LICENSE.txt

Library: Fluent UI Emoji | Author: Microsoft Corporation | License: MIT | Source: https://github.com/microsoft/fluentui-emoji | Sin Registro | 100% en tu Navegador

Palabras clave
#fluentui #emoji #keycap #3d

Keycap - Especificaciones tecnicas del vector

La fuente, el autor y la licencia estan en la vista previa y en el detalle del icono. Keycap

Identificador canonico del archivo fluentui-emoji/fluentui-emoji-keycap-4
Paquete de biblioteca de origen Fluent UI Emoji
Cuadrícula de coordenadas y viewBox viewBox="0 0 32 32"
Peso sin comprimir 7.237 bytes (~3.980 bytes gzipped)
Licencia SPDX y uso comercial MIT - Gratis para uso comercial
Upstream Source https://github.com/microsoft/fluentui-emoji
Formatos de exportación admitidos SVG, PNG (32px-2048px), WebP, ICO, React TSX, Vue 3, Svelte, Tailwind CSS, CSS Mask, Base64
Garantia de seguridad y privacidad Sin Registro | 100% en tu Navegador

Como usar y personalizar este icono: Keycap

  1. Personaliza visualmente: Color, Automático (trazo y relleno), Grosor del trazo (0.5px-4px), Ajustes de animación vectorial en vivo
  2. Descarga el vector o la imagen: Descargar SVG, PNG (transparente), WebP (optimizado) (2048x2048 px)
  3. Copia el código del framework: Copia código listo para React, Next.js, Vue 3, Svelte, Angular, HTML y mascaras CSS.
  4. Edición vectorial profunda: Editar en el editor SVG (77.087)
Consejo de accesibilidad (WCAG 2.1): Oculta los iconos decorativos con aria-hidden y focusable false. Da un aria-label claro a los botones que solo tienen icono. Voltea las flechas en horizontal para idiomas de derecha a izquierda. fluentui-emoji-keycap-4.svg aria-hidden="true" focusable="false"

Mas en Iconos vectoriales 3D

Explorar

Explorar más

Preguntas frecuentes

Keycap - Preguntas frecuentes

¿Qué licencia cubre Keycap? +

Keycap proviene de Fluent UI Emoji y está cubierto por MIT. Atribución: Crédito obligatorio.

¿En qué formatos puedo descargar Keycap? +

Keycap es un vector de estilo 3d (viewBox 0 0 32 32). Descarga SVG, PNG, WebP o ICO, o copia código React TSX, Vue 3, Svelte, Tailwind CSS, CSS Mask o Base64 desde esta página.

¿De dónde procede el icono Keycap? +

Keycap forma parte de la biblioteca Fluent UI Emoji de Microsoft Corporation, en la categoría Iconos vectoriales 3D. El texto completo de la licencia está en el archivo de aviso de la biblioteca enlazado en esta página.

100% en tu Navegador | 77.087 iconos

Editor SVG

Edita rutas, capas, colores y animaciones en tu navegador y exporta SVG limpio, PNG o código para frameworks.

Abrir en editor Explorar todos los iconos (77.087)

Escribe para buscar entre 77.087 iconos vectoriales...

Navegar | Enter para abrir Explorar todos los iconos

Comparar

Fuente y licencia del icono

Licencia Uso comercial Atribución Modificar o recolorear
MITPermitidoAviso en el paquetePermitido
ISCPermitidoAviso en el paquetePermitido
Apache-2.0PermitidoObligatorio con archivo de avisoPermitido
CC BY 4.0PermitidoCrédito obligatorioPermitido
CC-BY-SA-4.0PermitidoCompartir igualCompartir igual
CC BY-ND 2.0 / 4.0PermitidoCrédito obligatorioNo derivative works or modified copies
Trademark / BrandSolo uso referencialGuias del duenoRestringido

Vista previa del icono