opensearch icon logo

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

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

Use the opensearch icon logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="#005eb8" d="M246.95 94a9.05 9.05 0 0 0-9.05 9.05c0 74.476-60.374 134.85-134.85 134.85a9.05 9.05 0 1 0 0 18.1C187.522 256 256 187.522 256 103.05a9.05 9.05 0 0 0-9.05-9.05"/><path fill="#003b5c" d="M192.326 152c8.703-14.198 17.12-33.129 15.464-59.632C204.36 37.47 154.636-4.179 107.682.335c-18.38 1.767-37.255 16.75-35.578 43.587c.729 11.662 6.437 18.546 15.714 23.838c8.83 5.037 20.173 8.228 33.033 11.844c15.534 4.37 33.553 9.277 47.401 19.483c16.598 12.231 27.944 26.41 24.074 52.913"/><path fill="#005eb8" d="M15.674 56C6.971 70.198-1.446 89.129.21 115.632c3.43 54.899 53.154 96.546 100.108 92.033c18.38-1.767 37.255-16.75 35.578-43.587c-.729-11.662-6.437-18.546-15.714-23.838c-8.83-5.037-20.173-8.228-33.033-11.844c-15.534-4.37-33.553-9.277-47.401-19.483C23.15 96.682 11.804 82.503 15.674 56"/></svg>

React

import type { SVGProps } from "react";

export function LogosOpensearchIcon(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="#005eb8" d="M246.95 94a9.05 9.05 0 0 0-9.05 9.05c0 74.476-60.374 134.85-134.85 134.85a9.05 9.05 0 1 0 0 18.1C187.522 256 256 187.522 256 103.05a9.05 9.05 0 0 0-9.05-9.05"/><path fill="#003b5c" d="M192.326 152c8.703-14.198 17.12-33.129 15.464-59.632C204.36 37.47 154.636-4.179 107.682.335c-18.38 1.767-37.255 16.75-35.578 43.587c.729 11.662 6.437 18.546 15.714 23.838c8.83 5.037 20.173 8.228 33.033 11.844c15.534 4.37 33.553 9.277 47.401 19.483c16.598 12.231 27.944 26.41 24.074 52.913"/><path fill="#005eb8" d="M15.674 56C6.971 70.198-1.446 89.129.21 115.632c3.43 54.899 53.154 96.546 100.108 92.033c18.38-1.767 37.255-16.75 35.578-43.587c-.729-11.662-6.437-18.546-15.714-23.838c-8.83-5.037-20.173-8.228-33.033-11.844c-15.534-4.37-33.553-9.277-47.401-19.483C23.15 96.682 11.804 82.503 15.674 56"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="#005eb8" d="M246.95 94a9.05 9.05 0 0 0-9.05 9.05c0 74.476-60.374 134.85-134.85 134.85a9.05 9.05 0 1 0 0 18.1C187.522 256 256 187.522 256 103.05a9.05 9.05 0 0 0-9.05-9.05"/><path fill="#003b5c" d="M192.326 152c8.703-14.198 17.12-33.129 15.464-59.632C204.36 37.47 154.636-4.179 107.682.335c-18.38 1.767-37.255 16.75-35.578 43.587c.729 11.662 6.437 18.546 15.714 23.838c8.83 5.037 20.173 8.228 33.033 11.844c15.534 4.37 33.553 9.277 47.401 19.483c16.598 12.231 27.944 26.41 24.074 52.913"/><path fill="#005eb8" d="M15.674 56C6.971 70.198-1.446 89.129.21 115.632c3.43 54.899 53.154 96.546 100.108 92.033c18.38-1.767 37.255-16.75 35.578-43.587c-.729-11.662-6.437-18.546-15.714-23.838c-8.83-5.037-20.173-8.228-33.033-11.844c-15.534-4.37-33.553-9.277-47.401-19.483C23.15 96.682 11.804 82.503 15.674 56"/></svg>
</template>

CSS

.icon-opensearch-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%20256%22%3E%3Cpath%20fill%3D%22%23005eb8%22%20d%3D%22M246.95%2094a9.05%209.05%200%200%200-9.05%209.05c0%2074.476-60.374%20134.85-134.85%20134.85a9.05%209.05%200%201%200%200%2018.1C187.522%20256%20256%20187.522%20256%20103.05a9.05%209.05%200%200%200-9.05-9.05%22%2F%3E%3Cpath%20fill%3D%22%23003b5c%22%20d%3D%22M192.326%20152c8.703-14.198%2017.12-33.129%2015.464-59.632C204.36%2037.47%20154.636-4.179%20107.682.335c-18.38%201.767-37.255%2016.75-35.578%2043.587c.729%2011.662%206.437%2018.546%2015.714%2023.838c8.83%205.037%2020.173%208.228%2033.033%2011.844c15.534%204.37%2033.553%209.277%2047.401%2019.483c16.598%2012.231%2027.944%2026.41%2024.074%2052.913%22%2F%3E%3Cpath%20fill%3D%22%23005eb8%22%20d%3D%22M15.674%2056C6.971%2070.198-1.446%2089.129.21%20115.632c3.43%2054.899%2053.154%2096.546%20100.108%2092.033c18.38-1.767%2037.255-16.75%2035.578-43.587c-.729-11.662-6.437-18.546-15.714-23.838c-8.83-5.037-20.173-8.228-33.033-11.844c-15.534-4.37-33.553-9.277-47.401-19.483C23.15%2096.682%2011.804%2082.503%2015.674%2056%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%3Cpath%20fill%3D%22%23005eb8%22%20d%3D%22M246.95%2094a9.05%209.05%200%200%200-9.05%209.05c0%2074.476-60.374%20134.85-134.85%20134.85a9.05%209.05%200%201%200%200%2018.1C187.522%20256%20256%20187.522%20256%20103.05a9.05%209.05%200%200%200-9.05-9.05%22%2F%3E%3Cpath%20fill%3D%22%23003b5c%22%20d%3D%22M192.326%20152c8.703-14.198%2017.12-33.129%2015.464-59.632C204.36%2037.47%20154.636-4.179%20107.682.335c-18.38%201.767-37.255%2016.75-35.578%2043.587c.729%2011.662%206.437%2018.546%2015.714%2023.838c8.83%205.037%2020.173%208.228%2033.033%2011.844c15.534%204.37%2033.553%209.277%2047.401%2019.483c16.598%2012.231%2027.944%2026.41%2024.074%2052.913%22%2F%3E%3Cpath%20fill%3D%22%23005eb8%22%20d%3D%22M15.674%2056C6.971%2070.198-1.446%2089.129.21%20115.632c3.43%2054.899%2053.154%2096.546%20100.108%2092.033c18.38-1.767%2037.255-16.75%2035.578-43.587c-.729-11.662-6.437-18.546-15.714-23.838c-8.83-5.037-20.173-8.228-33.033-11.844c-15.534-4.37-33.553-9.277-47.401-19.483C23.15%2096.682%2011.804%2082.503%2015.674%2056%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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