keystonejs logo

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

Name
keystonejs
Set
SVG Logos
Style
Color
Viewbox
256×256
License
CC0

Use the keystonejs logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><defs><linearGradient id="SVGKXqgkc0k" x1="0%" x2="50%" y1="0%" y2="71.921%"><stop offset="0%" stop-color="#5ae8fa"/><stop offset="100%" stop-color="#2684ff"/></linearGradient></defs><path fill="url(#SVGKXqgkc0k)" d="M59.669 0H196.33c20.748 0 28.273 2.16 35.858 6.217s13.537 10.01 17.594 17.594C253.84 31.397 256 38.921 256 59.67v136.66c0 20.748-2.16 28.272-6.217 35.858c-4.057 7.584-10.009 13.537-17.594 17.594c-7.585 4.056-15.11 6.217-35.858 6.217H59.67c-20.748 0-28.272-2.16-35.858-6.217c-7.584-4.057-13.537-10.01-17.594-17.594S0 217.079 0 196.33V59.67c0-20.75 2.16-28.273 6.217-35.86c4.057-7.584 10.01-13.537 17.594-17.594C31.397 2.161 38.921 0 59.67 0m13.687 66.048v132.934h29.23V156.16l16.757-16.943l40.029 59.765h36.677l-56.971-80.43l51.945-52.504H154.53l-51.945 55.11v-55.11z"/></svg>

React

import type { SVGProps } from "react";

export function LogosKeystonejs(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><defs><linearGradient id="SVGKXqgkc0k" x1="0%" x2="50%" y1="0%" y2="71.921%"><stop offset="0%" stopColor="#5ae8fa"/><stop offset="100%" stopColor="#2684ff"/></linearGradient></defs><path fill="url(#SVGKXqgkc0k)" d="M59.669 0H196.33c20.748 0 28.273 2.16 35.858 6.217s13.537 10.01 17.594 17.594C253.84 31.397 256 38.921 256 59.67v136.66c0 20.748-2.16 28.272-6.217 35.858c-4.057 7.584-10.009 13.537-17.594 17.594c-7.585 4.056-15.11 6.217-35.858 6.217H59.67c-20.748 0-28.272-2.16-35.858-6.217c-7.584-4.057-13.537-10.01-17.594-17.594S0 217.079 0 196.33V59.67c0-20.75 2.16-28.273 6.217-35.86c4.057-7.584 10.01-13.537 17.594-17.594C31.397 2.161 38.921 0 59.67 0m13.687 66.048v132.934h29.23V156.16l16.757-16.943l40.029 59.765h36.677l-56.971-80.43l51.945-52.504H154.53l-51.945 55.11v-55.11z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><defs><linearGradient id="SVGKXqgkc0k" x1="0%" x2="50%" y1="0%" y2="71.921%"><stop offset="0%" stop-color="#5ae8fa"/><stop offset="100%" stop-color="#2684ff"/></linearGradient></defs><path fill="url(#SVGKXqgkc0k)" d="M59.669 0H196.33c20.748 0 28.273 2.16 35.858 6.217s13.537 10.01 17.594 17.594C253.84 31.397 256 38.921 256 59.67v136.66c0 20.748-2.16 28.272-6.217 35.858c-4.057 7.584-10.009 13.537-17.594 17.594c-7.585 4.056-15.11 6.217-35.858 6.217H59.67c-20.748 0-28.272-2.16-35.858-6.217c-7.584-4.057-13.537-10.01-17.594-17.594S0 217.079 0 196.33V59.67c0-20.75 2.16-28.273 6.217-35.86c4.057-7.584 10.01-13.537 17.594-17.594C31.397 2.161 38.921 0 59.67 0m13.687 66.048v132.934h29.23V156.16l16.757-16.943l40.029 59.765h36.677l-56.971-80.43l51.945-52.504H154.53l-51.945 55.11v-55.11z"/></svg>
</template>

CSS

.icon-keystonejs {
  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%20256%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGKXqgkc0k%22%20x1%3D%220%25%22%20x2%3D%2250%25%22%20y1%3D%220%25%22%20y2%3D%2271.921%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%235ae8fa%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%232684ff%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23SVGKXqgkc0k)%22%20d%3D%22M59.669%200H196.33c20.748%200%2028.273%202.16%2035.858%206.217s13.537%2010.01%2017.594%2017.594C253.84%2031.397%20256%2038.921%20256%2059.67v136.66c0%2020.748-2.16%2028.272-6.217%2035.858c-4.057%207.584-10.009%2013.537-17.594%2017.594c-7.585%204.056-15.11%206.217-35.858%206.217H59.67c-20.748%200-28.272-2.16-35.858-6.217c-7.584-4.057-13.537-10.01-17.594-17.594S0%20217.079%200%20196.33V59.67c0-20.75%202.16-28.273%206.217-35.86c4.057-7.584%2010.01-13.537%2017.594-17.594C31.397%202.161%2038.921%200%2059.67%200m13.687%2066.048v132.934h29.23V156.16l16.757-16.943l40.029%2059.765h36.677l-56.971-80.43l51.945-52.504H154.53l-51.945%2055.11v-55.11z%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%20256%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22SVGKXqgkc0k%22%20x1%3D%220%25%22%20x2%3D%2250%25%22%20y1%3D%220%25%22%20y2%3D%2271.921%25%22%3E%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%235ae8fa%22%2F%3E%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%232684ff%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20fill%3D%22url(%23SVGKXqgkc0k)%22%20d%3D%22M59.669%200H196.33c20.748%200%2028.273%202.16%2035.858%206.217s13.537%2010.01%2017.594%2017.594C253.84%2031.397%20256%2038.921%20256%2059.67v136.66c0%2020.748-2.16%2028.272-6.217%2035.858c-4.057%207.584-10.009%2013.537-17.594%2017.594c-7.585%204.056-15.11%206.217-35.858%206.217H59.67c-20.748%200-28.272-2.16-35.858-6.217c-7.584-4.057-13.537-10.01-17.594-17.594S0%20217.079%200%20196.33V59.67c0-20.75%202.16-28.273%206.217-35.86c4.057-7.584%2010.01-13.537%2017.594-17.594C31.397%202.161%2038.921%200%2059.67%200m13.687%2066.048v132.934h29.23V156.16l16.757-16.943l40.029%2059.765h36.677l-56.971-80.43l51.945-52.504H154.53l-51.945%2055.11v-55.11z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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