spectrum-line from Remix Icon by Remix Design · Line · Logos · Apache-2.0 Free for personal and commercial use.

Name
spectrum-line
Set
Remix Icon
Style
Line
Category
Logos
Viewbox
24×24
License
Apache 2.0

1 other variant in Remix Icon

The same icon in other sets

More logos icons from Remix Icon

Use the spectrum icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m11.389 2.001l1.81.005l.844.014c7.162.165 7.939 1.512 7.957 9.667l-.005 1.512l-.014.844c-.165 7.161-1.512 7.938-9.667 7.957l-1.512-.006l-.888-.015c-6.854-.163-7.828-1.427-7.907-8.78L2 11.691l.006-.89l.014-.865c.165-7.053 1.486-7.897 9.368-7.935M14.12 4.01L10.883 4l-1.322.01c-5.489.082-5.544.82-5.56 7.403l.002 2.175l.01 1.04c.088 4.983.793 5.343 6.399 5.37l3.455-.002l.776-.01c5.108-.091 5.346-.836 5.357-6.877l-.002-2.742l-.012-1.056c-.094-4.796-.785-5.25-5.866-5.303M8.25 7A8.75 8.75 0 0 1 17 15.75v.583a.667.667 0 0 1-.666.667h-3.667a.667.667 0 0 1-.666-.667v-.583A3.75 3.75 0 0 0 8.25 12h-.584A.667.667 0 0 1 7 11.333V7.667C7 7.299 7.299 7 7.667 7z"/></svg>

React

import type { SVGProps } from "react";

export function RiSpectrumLine(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m11.389 2.001l1.81.005l.844.014c7.162.165 7.939 1.512 7.957 9.667l-.005 1.512l-.014.844c-.165 7.161-1.512 7.938-9.667 7.957l-1.512-.006l-.888-.015c-6.854-.163-7.828-1.427-7.907-8.78L2 11.691l.006-.89l.014-.865c.165-7.053 1.486-7.897 9.368-7.935M14.12 4.01L10.883 4l-1.322.01c-5.489.082-5.544.82-5.56 7.403l.002 2.175l.01 1.04c.088 4.983.793 5.343 6.399 5.37l3.455-.002l.776-.01c5.108-.091 5.346-.836 5.357-6.877l-.002-2.742l-.012-1.056c-.094-4.796-.785-5.25-5.866-5.303M8.25 7A8.75 8.75 0 0 1 17 15.75v.583a.667.667 0 0 1-.666.667h-3.667a.667.667 0 0 1-.666-.667v-.583A3.75 3.75 0 0 0 8.25 12h-.584A.667.667 0 0 1 7 11.333V7.667C7 7.299 7.299 7 7.667 7z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m11.389 2.001l1.81.005l.844.014c7.162.165 7.939 1.512 7.957 9.667l-.005 1.512l-.014.844c-.165 7.161-1.512 7.938-9.667 7.957l-1.512-.006l-.888-.015c-6.854-.163-7.828-1.427-7.907-8.78L2 11.691l.006-.89l.014-.865c.165-7.053 1.486-7.897 9.368-7.935M14.12 4.01L10.883 4l-1.322.01c-5.489.082-5.544.82-5.56 7.403l.002 2.175l.01 1.04c.088 4.983.793 5.343 6.399 5.37l3.455-.002l.776-.01c5.108-.091 5.346-.836 5.357-6.877l-.002-2.742l-.012-1.056c-.094-4.796-.785-5.25-5.866-5.303M8.25 7A8.75 8.75 0 0 1 17 15.75v.583a.667.667 0 0 1-.666.667h-3.667a.667.667 0 0 1-.666-.667v-.583A3.75 3.75 0 0 0 8.25 12h-.584A.667.667 0 0 1 7 11.333V7.667C7 7.299 7.299 7 7.667 7z"/></svg>
</template>

CSS

.icon-spectrum-line {
  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%22currentColor%22%20d%3D%22m11.389%202.001l1.81.005l.844.014c7.162.165%207.939%201.512%207.957%209.667l-.005%201.512l-.014.844c-.165%207.161-1.512%207.938-9.667%207.957l-1.512-.006l-.888-.015c-6.854-.163-7.828-1.427-7.907-8.78L2%2011.691l.006-.89l.014-.865c.165-7.053%201.486-7.897%209.368-7.935M14.12%204.01L10.883%204l-1.322.01c-5.489.082-5.544.82-5.56%207.403l.002%202.175l.01%201.04c.088%204.983.793%205.343%206.399%205.37l3.455-.002l.776-.01c5.108-.091%205.346-.836%205.357-6.877l-.002-2.742l-.012-1.056c-.094-4.796-.785-5.25-5.866-5.303M8.25%207A8.75%208.75%200%200%201%2017%2015.75v.583a.667.667%200%200%201-.666.667h-3.667a.667.667%200%200%201-.666-.667v-.583A3.75%203.75%200%200%200%208.25%2012h-.584A.667.667%200%200%201%207%2011.333V7.667C7%207.299%207.299%207%207.667%207z%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%22currentColor%22%20d%3D%22m11.389%202.001l1.81.005l.844.014c7.162.165%207.939%201.512%207.957%209.667l-.005%201.512l-.014.844c-.165%207.161-1.512%207.938-9.667%207.957l-1.512-.006l-.888-.015c-6.854-.163-7.828-1.427-7.907-8.78L2%2011.691l.006-.89l.014-.865c.165-7.053%201.486-7.897%209.368-7.935M14.12%204.01L10.883%204l-1.322.01c-5.489.082-5.544.82-5.56%207.403l.002%202.175l.01%201.04c.088%204.983.793%205.343%206.399%205.37l3.455-.002l.776-.01c5.108-.091%205.346-.836%205.357-6.877l-.002-2.742l-.012-1.056c-.094-4.796-.785-5.25-5.866-5.303M8.25%207A8.75%208.75%200%200%201%2017%2015.75v.583a.667.667%200%200%201-.666.667h-3.667a.667.667%200%200%201-.666-.667v-.583A3.75%203.75%200%200%200%208.25%2012h-.584A.667.667%200%200%201%207%2011.333V7.667C7%207.299%207.299%207%207.667%207z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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