cube icon logo

cube-icon from SVG Logos by Gil Barbara · Color · CC0-1.0 Free for personal and commercial use.

Name
cube-icon
Set
SVG Logos
Style
Color
Viewbox
256×296
License
CC0

Use the cube icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 296"><path fill="#ff6492" d="M256 74.249L128.032 0v51.377L256 125.299v-51.06z"/><path fill="#141446" d="m256 125.299l-38.391 22.397L128 95.802l-51.198 29.539l-38.401-20.751l89.62-53.213z"/><path fill="#a14474" d="M76.802 125.341L38.401 104.59v43.106z"/><path fill="#141446" d="m0 221.144l128-73.448l128 73.448l-128 74.249z"/><path fill="#ff6492" d="M256 170.167L128 95v52.696l128 73.448z"/><path fill="#7a77ff" d="M38.401 147.696V104.59l89.62-53.213V0L0 74.249v146.895l128-73.448V95z"/></svg>

React

import type { SVGProps } from "react";

export function LogosCubeIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 296"><path fill="#ff6492" d="M256 74.249L128.032 0v51.377L256 125.299v-51.06z"/><path fill="#141446" d="m256 125.299l-38.391 22.397L128 95.802l-51.198 29.539l-38.401-20.751l89.62-53.213z"/><path fill="#a14474" d="M76.802 125.341L38.401 104.59v43.106z"/><path fill="#141446" d="m0 221.144l128-73.448l128 73.448l-128 74.249z"/><path fill="#ff6492" d="M256 170.167L128 95v52.696l128 73.448z"/><path fill="#7a77ff" d="M38.401 147.696V104.59l89.62-53.213V0L0 74.249v146.895l128-73.448V95z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 296"><path fill="#ff6492" d="M256 74.249L128.032 0v51.377L256 125.299v-51.06z"/><path fill="#141446" d="m256 125.299l-38.391 22.397L128 95.802l-51.198 29.539l-38.401-20.751l89.62-53.213z"/><path fill="#a14474" d="M76.802 125.341L38.401 104.59v43.106z"/><path fill="#141446" d="m0 221.144l128-73.448l128 73.448l-128 74.249z"/><path fill="#ff6492" d="M256 170.167L128 95v52.696l128 73.448z"/><path fill="#7a77ff" d="M38.401 147.696V104.59l89.62-53.213V0L0 74.249v146.895l128-73.448V95z"/></svg>
</template>

CSS

.icon-cube-icon {
  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%20256%20296%22%3E%3Cpath%20fill%3D%22%23ff6492%22%20d%3D%22M256%2074.249L128.032%200v51.377L256%20125.299v-51.06z%22%2F%3E%3Cpath%20fill%3D%22%23141446%22%20d%3D%22m256%20125.299l-38.391%2022.397L128%2095.802l-51.198%2029.539l-38.401-20.751l89.62-53.213z%22%2F%3E%3Cpath%20fill%3D%22%23a14474%22%20d%3D%22M76.802%20125.341L38.401%20104.59v43.106z%22%2F%3E%3Cpath%20fill%3D%22%23141446%22%20d%3D%22m0%20221.144l128-73.448l128%2073.448l-128%2074.249z%22%2F%3E%3Cpath%20fill%3D%22%23ff6492%22%20d%3D%22M256%20170.167L128%2095v52.696l128%2073.448z%22%2F%3E%3Cpath%20fill%3D%22%237a77ff%22%20d%3D%22M38.401%20147.696V104.59l89.62-53.213V0L0%2074.249v146.895l128-73.448V95z%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%20256%20296%22%3E%3Cpath%20fill%3D%22%23ff6492%22%20d%3D%22M256%2074.249L128.032%200v51.377L256%20125.299v-51.06z%22%2F%3E%3Cpath%20fill%3D%22%23141446%22%20d%3D%22m256%20125.299l-38.391%2022.397L128%2095.802l-51.198%2029.539l-38.401-20.751l89.62-53.213z%22%2F%3E%3Cpath%20fill%3D%22%23a14474%22%20d%3D%22M76.802%20125.341L38.401%20104.59v43.106z%22%2F%3E%3Cpath%20fill%3D%22%23141446%22%20d%3D%22m0%20221.144l128-73.448l128%2073.448l-128%2074.249z%22%2F%3E%3Cpath%20fill%3D%22%23ff6492%22%20d%3D%22M256%20170.167L128%2095v52.696l128%2073.448z%22%2F%3E%3Cpath%20fill%3D%22%237a77ff%22%20d%3D%22M38.401%20147.696V104.59l89.62-53.213V0L0%2074.249v146.895l128-73.448V95z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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