kiro logo
kiro-color from LobeHub AI Icons by LobeHub · Color · MIT Free for personal and commercial use.
- Name
- kiro-color
- Set
- LobeHub AI Icons
- Style
- Color
- Viewbox
- 24×24
- License
- MIT
2 other variants in LobeHub AI Icons
The same logo in other sets
Use the kiro logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="#9046ff" d="M18.8 0H5.2A5.2 5.2 0 000 5.2v13.6A5.2 5.2 0 005.2 24h13.6a5.2 5.2 0 005.2-5.2V5.2A5.2 5.2 0 0018.8 0z"/><path fill="#fff" d="M7.97 16.376c-1.644 3.642 1.86 4.556 4.443 2.424.76 2.39 3.608.607 4.631-1.247 2.251-4.084 1.342-8.249 1.108-9.108-1.6-5.859-9.6-5.869-10.976.03-.323 1.033-.328 2.206-.507 3.423-.09.617-.16 1.009-.393 1.655-.139.373-.323.7-.62 1.257-.458.865-.264 2.53 2.101 1.665l.224-.1h-.01l-.001.001z"/><path d="M12.722 10.985c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.218-.97a.61.61 0 01.537-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005zm2.703 0c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.219-.97a.61.61 0 01.536-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005z"/></svg>
React
import type { SVGProps } from "react";
export function LobehubKiroColor(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="#9046ff" d="M18.8 0H5.2A5.2 5.2 0 000 5.2v13.6A5.2 5.2 0 005.2 24h13.6a5.2 5.2 0 005.2-5.2V5.2A5.2 5.2 0 0018.8 0z"/><path fill="#fff" d="M7.97 16.376c-1.644 3.642 1.86 4.556 4.443 2.424.76 2.39 3.608.607 4.631-1.247 2.251-4.084 1.342-8.249 1.108-9.108-1.6-5.859-9.6-5.869-10.976.03-.323 1.033-.328 2.206-.507 3.423-.09.617-.16 1.009-.393 1.655-.139.373-.323.7-.62 1.257-.458.865-.264 2.53 2.101 1.665l.224-.1h-.01l-.001.001z"/><path d="M12.722 10.985c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.218-.97a.61.61 0 01.537-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005zm2.703 0c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.219-.97a.61.61 0 01.536-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="#9046ff" d="M18.8 0H5.2A5.2 5.2 0 000 5.2v13.6A5.2 5.2 0 005.2 24h13.6a5.2 5.2 0 005.2-5.2V5.2A5.2 5.2 0 0018.8 0z"/><path fill="#fff" d="M7.97 16.376c-1.644 3.642 1.86 4.556 4.443 2.424.76 2.39 3.608.607 4.631-1.247 2.251-4.084 1.342-8.249 1.108-9.108-1.6-5.859-9.6-5.869-10.976.03-.323 1.033-.328 2.206-.507 3.423-.09.617-.16 1.009-.393 1.655-.139.373-.323.7-.62 1.257-.458.865-.264 2.53 2.101 1.665l.224-.1h-.01l-.001.001z"/><path d="M12.722 10.985c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.218-.97a.61.61 0 01.537-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005zm2.703 0c-.656 0-.755-.785-.755-1.252 0-.423.074-.756.219-.97a.61.61 0 01.536-.283c.229 0 .428.095.567.289.159.218.243.55.243.964 0 .785-.303 1.252-.805 1.252h-.005z"/></svg> </template>
CSS
.icon-kiro-color {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%239046ff%22%20d%3D%22M18.8%200H5.2A5.2%205.2%200%20000%205.2v13.6A5.2%205.2%200%20005.2%2024h13.6a5.2%205.2%200%20005.2-5.2V5.2A5.2%205.2%200%200018.8%200z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M7.97%2016.376c-1.644%203.642%201.86%204.556%204.443%202.424.76%202.39%203.608.607%204.631-1.247%202.251-4.084%201.342-8.249%201.108-9.108-1.6-5.859-9.6-5.869-10.976.03-.323%201.033-.328%202.206-.507%203.423-.09.617-.16%201.009-.393%201.655-.139.373-.323.7-.62%201.257-.458.865-.264%202.53%202.101%201.665l.224-.1h-.01l-.001.001z%22%2F%3E%3Cpath%20d%3D%22M12.722%2010.985c-.656%200-.755-.785-.755-1.252%200-.423.074-.756.218-.97a.61.61%200%2001.537-.283c.229%200%20.428.095.567.289.159.218.243.55.243.964%200%20.785-.303%201.252-.805%201.252h-.005zm2.703%200c-.656%200-.755-.785-.755-1.252%200-.423.074-.756.219-.97a.61.61%200%2001.536-.283c.229%200%20.428.095.567.289.159.218.243.55.243.964%200%20.785-.303%201.252-.805%201.252h-.005z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%239046ff%22%20d%3D%22M18.8%200H5.2A5.2%205.2%200%20000%205.2v13.6A5.2%205.2%200%20005.2%2024h13.6a5.2%205.2%200%20005.2-5.2V5.2A5.2%205.2%200%200018.8%200z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M7.97%2016.376c-1.644%203.642%201.86%204.556%204.443%202.424.76%202.39%203.608.607%204.631-1.247%202.251-4.084%201.342-8.249%201.108-9.108-1.6-5.859-9.6-5.869-10.976.03-.323%201.033-.328%202.206-.507%203.423-.09.617-.16%201.009-.393%201.655-.139.373-.323.7-.62%201.257-.458.865-.264%202.53%202.101%201.665l.224-.1h-.01l-.001.001z%22%2F%3E%3Cpath%20d%3D%22M12.722%2010.985c-.656%200-.755-.785-.755-1.252%200-.423.074-.756.218-.97a.61.61%200%2001.537-.283c.229%200%20.428.095.567.289.159.218.243.55.243.964%200%20.785-.303%201.252-.805%201.252h-.005zm2.703%200c-.656%200-.755-.785-.755-1.252%200-.423.074-.756.219-.97a.61.61%200%2001.536-.283c.229%200%20.428.095.567.289.159.218.243.55.243.964%200%20.785-.303%201.252-.805%201.252h-.005z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/lobehub/kiro-color.svg?color=%231a73e8&size=48