opencode logo

opencode-text from LobeHub AI Icons by LobeHub · Wordmark · MIT Free for personal and commercial use.

Name: opencode-text
Set: LobeHub AI Icons
Style: Wordmark
Viewbox: 138×24
License: MIT

1 other variant in LobeHub AI Icons

The same logo in other sets

opencodeSVG Logos opencodeMaterial Icon Theme opencodeSimple Icons

Use the opencode logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 138 24"><g fill="currentColor" fill-rule="evenodd"><path fill-opacity=".25" d="M12.429 17.143H5.57v-6.857h6.858v6.857z"/><path fill-opacity=".75" d="M12.428 6.857H5.571v10.286h6.857V6.857zm3.43 13.715H2.142V3.429h13.714v17.143z"/><path fill-opacity=".25" d="M29.571 17.143h-6.857v-6.857h6.857v6.857z"/><path fill-opacity=".75" d="M22.714 17.143h6.858V6.857h-6.858v10.286zM33 20.572H22.714V24h-3.428V3.43H33v17.143z"/><path fill-opacity=".25" d="M50.143 13.714v3.429H39.857v-3.429h10.286z"/><path fill-opacity=".75" d="M50.143 13.714H39.857v3.429h10.286v3.429H36.429V3.429h13.714v10.285zm-10.286-3.428h6.857V6.857h-6.857v3.429z"/><path fill-opacity=".25" d="M63.857 20.571H57V10.286h6.857V20.57z"/><path fill-opacity=".75" d="M63.857 6.857H57v13.715h-3.429V3.429h10.286v3.428zm3.429 13.715h-3.429V6.857h3.429v13.715z"/><path fill-opacity=".25" d="M84.428 17.143H74.144v-6.857h10.285v6.857z"/><path d="M84.428 6.857H74.144v10.286h10.285v3.429H70.715V3.429H84.43v3.428z"/><path fill-opacity=".25" d="M98.143 17.143h-6.857v-6.857h6.857v6.857z"/><path d="M98.143 6.857h-6.857v10.286h6.857V6.857zm3.428 13.715H87.857V3.429h13.714v17.143z"/><path fill-opacity=".25" d="M115.286 17.143h-6.857v-6.857h6.857v6.857z"/><path d="M115.286 6.857h-6.857v10.286h6.857V6.857zm3.428 13.714H105V3.43h10.286V0h3.428v20.571z"/><path fill-opacity=".25" d="M135.857 13.714v3.429h-10.286v-3.429h10.286z"/><path d="M125.571 6.857v3.429h6.858V6.857h-6.858zm10.286 6.857h-10.286v3.429h10.286v3.429h-13.714V3.429h13.714v10.285z"/></g></svg>

React

import type { SVGProps } from "react";

export function LobehubOpencodeText(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 138 24"><g fill="currentColor" fillRule="evenodd"><path fillOpacity=".25" d="M12.429 17.143H5.57v-6.857h6.858v6.857z"/><path fillOpacity=".75" d="M12.428 6.857H5.571v10.286h6.857V6.857zm3.43 13.715H2.142V3.429h13.714v17.143z"/><path fillOpacity=".25" d="M29.571 17.143h-6.857v-6.857h6.857v6.857z"/><path fillOpacity=".75" d="M22.714 17.143h6.858V6.857h-6.858v10.286zM33 20.572H22.714V24h-3.428V3.43H33v17.143z"/><path fillOpacity=".25" d="M50.143 13.714v3.429H39.857v-3.429h10.286z"/><path fillOpacity=".75" d="M50.143 13.714H39.857v3.429h10.286v3.429H36.429V3.429h13.714v10.285zm-10.286-3.428h6.857V6.857h-6.857v3.429z"/><path fillOpacity=".25" d="M63.857 20.571H57V10.286h6.857V20.57z"/><path fillOpacity=".75" d="M63.857 6.857H57v13.715h-3.429V3.429h10.286v3.428zm3.429 13.715h-3.429V6.857h3.429v13.715z"/><path fillOpacity=".25" d="M84.428 17.143H74.144v-6.857h10.285v6.857z"/><path d="M84.428 6.857H74.144v10.286h10.285v3.429H70.715V3.429H84.43v3.428z"/><path fillOpacity=".25" d="M98.143 17.143h-6.857v-6.857h6.857v6.857z"/><path d="M98.143 6.857h-6.857v10.286h6.857V6.857zm3.428 13.715H87.857V3.429h13.714v17.143z"/><path fillOpacity=".25" d="M115.286 17.143h-6.857v-6.857h6.857v6.857z"/><path d="M115.286 6.857h-6.857v10.286h6.857V6.857zm3.428 13.714H105V3.43h10.286V0h3.428v20.571z"/><path fillOpacity=".25" d="M135.857 13.714v3.429h-10.286v-3.429h10.286z"/><path d="M125.571 6.857v3.429h6.858V6.857h-6.858zm10.286 6.857h-10.286v3.429h10.286v3.429h-13.714V3.429h13.714v10.285z"/></g></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 138 24"><g fill="currentColor" fill-rule="evenodd"><path fill-opacity=".25" d="M12.429 17.143H5.57v-6.857h6.858v6.857z"/><path fill-opacity=".75" d="M12.428 6.857H5.571v10.286h6.857V6.857zm3.43 13.715H2.142V3.429h13.714v17.143z"/><path fill-opacity=".25" d="M29.571 17.143h-6.857v-6.857h6.857v6.857z"/><path fill-opacity=".75" d="M22.714 17.143h6.858V6.857h-6.858v10.286zM33 20.572H22.714V24h-3.428V3.43H33v17.143z"/><path fill-opacity=".25" d="M50.143 13.714v3.429H39.857v-3.429h10.286z"/><path fill-opacity=".75" d="M50.143 13.714H39.857v3.429h10.286v3.429H36.429V3.429h13.714v10.285zm-10.286-3.428h6.857V6.857h-6.857v3.429z"/><path fill-opacity=".25" d="M63.857 20.571H57V10.286h6.857V20.57z"/><path fill-opacity=".75" d="M63.857 6.857H57v13.715h-3.429V3.429h10.286v3.428zm3.429 13.715h-3.429V6.857h3.429v13.715z"/><path fill-opacity=".25" d="M84.428 17.143H74.144v-6.857h10.285v6.857z"/><path d="M84.428 6.857H74.144v10.286h10.285v3.429H70.715V3.429H84.43v3.428z"/><path fill-opacity=".25" d="M98.143 17.143h-6.857v-6.857h6.857v6.857z"/><path d="M98.143 6.857h-6.857v10.286h6.857V6.857zm3.428 13.715H87.857V3.429h13.714v17.143z"/><path fill-opacity=".25" d="M115.286 17.143h-6.857v-6.857h6.857v6.857z"/><path d="M115.286 6.857h-6.857v10.286h6.857V6.857zm3.428 13.714H105V3.43h10.286V0h3.428v20.571z"/><path fill-opacity=".25" d="M135.857 13.714v3.429h-10.286v-3.429h10.286z"/><path d="M125.571 6.857v3.429h6.858V6.857h-6.858zm10.286 6.857h-10.286v3.429h10.286v3.429h-13.714V3.429h13.714v10.285z"/></g></svg>
</template>

CSS

.icon-opencode-text {
  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%20138%2024%22%3E%3Cg%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M12.429%2017.143H5.57v-6.857h6.858v6.857z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M12.428%206.857H5.571v10.286h6.857V6.857zm3.43%2013.715H2.142V3.429h13.714v17.143z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M29.571%2017.143h-6.857v-6.857h6.857v6.857z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M22.714%2017.143h6.858V6.857h-6.858v10.286zM33%2020.572H22.714V24h-3.428V3.43H33v17.143z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M50.143%2013.714v3.429H39.857v-3.429h10.286z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M50.143%2013.714H39.857v3.429h10.286v3.429H36.429V3.429h13.714v10.285zm-10.286-3.428h6.857V6.857h-6.857v3.429z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M63.857%2020.571H57V10.286h6.857V20.57z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M63.857%206.857H57v13.715h-3.429V3.429h10.286v3.428zm3.429%2013.715h-3.429V6.857h3.429v13.715z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M84.428%2017.143H74.144v-6.857h10.285v6.857z%22%2F%3E%3Cpath%20d%3D%22M84.428%206.857H74.144v10.286h10.285v3.429H70.715V3.429H84.43v3.428z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M98.143%2017.143h-6.857v-6.857h6.857v6.857z%22%2F%3E%3Cpath%20d%3D%22M98.143%206.857h-6.857v10.286h6.857V6.857zm3.428%2013.715H87.857V3.429h13.714v17.143z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M115.286%2017.143h-6.857v-6.857h6.857v6.857z%22%2F%3E%3Cpath%20d%3D%22M115.286%206.857h-6.857v10.286h6.857V6.857zm3.428%2013.714H105V3.43h10.286V0h3.428v20.571z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M135.857%2013.714v3.429h-10.286v-3.429h10.286z%22%2F%3E%3Cpath%20d%3D%22M125.571%206.857v3.429h6.858V6.857h-6.858zm10.286%206.857h-10.286v3.429h10.286v3.429h-13.714V3.429h13.714v10.285z%22%2F%3E%3C%2Fg%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%20138%2024%22%3E%3Cg%20fill%3D%22currentColor%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M12.429%2017.143H5.57v-6.857h6.858v6.857z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M12.428%206.857H5.571v10.286h6.857V6.857zm3.43%2013.715H2.142V3.429h13.714v17.143z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M29.571%2017.143h-6.857v-6.857h6.857v6.857z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M22.714%2017.143h6.858V6.857h-6.858v10.286zM33%2020.572H22.714V24h-3.428V3.43H33v17.143z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M50.143%2013.714v3.429H39.857v-3.429h10.286z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M50.143%2013.714H39.857v3.429h10.286v3.429H36.429V3.429h13.714v10.285zm-10.286-3.428h6.857V6.857h-6.857v3.429z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M63.857%2020.571H57V10.286h6.857V20.57z%22%2F%3E%3Cpath%20fill-opacity%3D%22.75%22%20d%3D%22M63.857%206.857H57v13.715h-3.429V3.429h10.286v3.428zm3.429%2013.715h-3.429V6.857h3.429v13.715z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M84.428%2017.143H74.144v-6.857h10.285v6.857z%22%2F%3E%3Cpath%20d%3D%22M84.428%206.857H74.144v10.286h10.285v3.429H70.715V3.429H84.43v3.428z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M98.143%2017.143h-6.857v-6.857h6.857v6.857z%22%2F%3E%3Cpath%20d%3D%22M98.143%206.857h-6.857v10.286h6.857V6.857zm3.428%2013.715H87.857V3.429h13.714v17.143z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M115.286%2017.143h-6.857v-6.857h6.857v6.857z%22%2F%3E%3Cpath%20d%3D%22M115.286%206.857h-6.857v10.286h6.857V6.857zm3.428%2013.714H105V3.43h10.286V0h3.428v20.571z%22%2F%3E%3Cpath%20fill-opacity%3D%22.25%22%20d%3D%22M135.857%2013.714v3.429h-10.286v-3.429h10.286z%22%2F%3E%3Cpath%20d%3D%22M125.571%206.857v3.429h6.858V6.857h-6.858zm10.286%206.857h-10.286v3.429h10.286v3.429h-13.714V3.429h13.714v10.285z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/lobehub/opencode-text.svg?color=%231a73e8&size=48