language icon

language-solid from HeroIcons by Refactoring UI Inc · Solid 24x24 · MIT Free for personal and commercial use.

Name
language-solid
Set
HeroIcons
Style
Solid 24x24
Viewbox
24×24
License
MIT

3 other variants in HeroIcons

The same icon in other sets

Use the language icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M9 2.25a.75.75 0 0 1 .75.75v1.506a49 49 0 0 1 5.343.371a.75.75 0 1 1-.186 1.489q-.99-.124-1.99-.206a18.7 18.7 0 0 1-2.97 6.323q.476.576 1 1.108a.75.75 0 0 1-1.07 1.05A19 19 0 0 1 9 13.688a18.8 18.8 0 0 1-5.656 4.482a.75.75 0 0 1-.688-1.333a17.3 17.3 0 0 0 5.396-4.353A18.7 18.7 0 0 1 5.89 8.598a.75.75 0 0 1 1.388-.568A17.2 17.2 0 0 0 9 11.224a17.2 17.2 0 0 0 2.391-5.165a48 48 0 0 0-8.298.307a.75.75 0 0 1-.186-1.489a49 49 0 0 1 5.343-.371V3A.75.75 0 0 1 9 2.25M15.75 9a.75.75 0 0 1 .68.433l5.25 11.25a.75.75 0 1 1-1.36.634l-1.198-2.567h-6.744l-1.198 2.567a.75.75 0 0 1-1.36-.634l5.25-11.25A.75.75 0 0 1 15.75 9m-2.672 8.25h5.344l-2.672-5.726z" clip-rule="evenodd"/></svg>

React

import type { SVGProps } from "react";

export function HeroiconsLanguageSolid(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" fillRule="evenodd" d="M9 2.25a.75.75 0 0 1 .75.75v1.506a49 49 0 0 1 5.343.371a.75.75 0 1 1-.186 1.489q-.99-.124-1.99-.206a18.7 18.7 0 0 1-2.97 6.323q.476.576 1 1.108a.75.75 0 0 1-1.07 1.05A19 19 0 0 1 9 13.688a18.8 18.8 0 0 1-5.656 4.482a.75.75 0 0 1-.688-1.333a17.3 17.3 0 0 0 5.396-4.353A18.7 18.7 0 0 1 5.89 8.598a.75.75 0 0 1 1.388-.568A17.2 17.2 0 0 0 9 11.224a17.2 17.2 0 0 0 2.391-5.165a48 48 0 0 0-8.298.307a.75.75 0 0 1-.186-1.489a49 49 0 0 1 5.343-.371V3A.75.75 0 0 1 9 2.25M15.75 9a.75.75 0 0 1 .68.433l5.25 11.25a.75.75 0 1 1-1.36.634l-1.198-2.567h-6.744l-1.198 2.567a.75.75 0 0 1-1.36-.634l5.25-11.25A.75.75 0 0 1 15.75 9m-2.672 8.25h5.344l-2.672-5.726z" clipRule="evenodd"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M9 2.25a.75.75 0 0 1 .75.75v1.506a49 49 0 0 1 5.343.371a.75.75 0 1 1-.186 1.489q-.99-.124-1.99-.206a18.7 18.7 0 0 1-2.97 6.323q.476.576 1 1.108a.75.75 0 0 1-1.07 1.05A19 19 0 0 1 9 13.688a18.8 18.8 0 0 1-5.656 4.482a.75.75 0 0 1-.688-1.333a17.3 17.3 0 0 0 5.396-4.353A18.7 18.7 0 0 1 5.89 8.598a.75.75 0 0 1 1.388-.568A17.2 17.2 0 0 0 9 11.224a17.2 17.2 0 0 0 2.391-5.165a48 48 0 0 0-8.298.307a.75.75 0 0 1-.186-1.489a49 49 0 0 1 5.343-.371V3A.75.75 0 0 1 9 2.25M15.75 9a.75.75 0 0 1 .68.433l5.25 11.25a.75.75 0 1 1-1.36.634l-1.198-2.567h-6.744l-1.198 2.567a.75.75 0 0 1-1.36-.634l5.25-11.25A.75.75 0 0 1 15.75 9m-2.672 8.25h5.344l-2.672-5.726z" clip-rule="evenodd"/></svg>
</template>

CSS

.icon-language-solid {
  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%20fill-rule%3D%22evenodd%22%20d%3D%22M9%202.25a.75.75%200%200%201%20.75.75v1.506a49%2049%200%200%201%205.343.371a.75.75%200%201%201-.186%201.489q-.99-.124-1.99-.206a18.7%2018.7%200%200%201-2.97%206.323q.476.576%201%201.108a.75.75%200%200%201-1.07%201.05A19%2019%200%200%201%209%2013.688a18.8%2018.8%200%200%201-5.656%204.482a.75.75%200%200%201-.688-1.333a17.3%2017.3%200%200%200%205.396-4.353A18.7%2018.7%200%200%201%205.89%208.598a.75.75%200%200%201%201.388-.568A17.2%2017.2%200%200%200%209%2011.224a17.2%2017.2%200%200%200%202.391-5.165a48%2048%200%200%200-8.298.307a.75.75%200%200%201-.186-1.489a49%2049%200%200%201%205.343-.371V3A.75.75%200%200%201%209%202.25M15.75%209a.75.75%200%200%201%20.68.433l5.25%2011.25a.75.75%200%201%201-1.36.634l-1.198-2.567h-6.744l-1.198%202.567a.75.75%200%200%201-1.36-.634l5.25-11.25A.75.75%200%200%201%2015.75%209m-2.672%208.25h5.344l-2.672-5.726z%22%20clip-rule%3D%22evenodd%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%20fill-rule%3D%22evenodd%22%20d%3D%22M9%202.25a.75.75%200%200%201%20.75.75v1.506a49%2049%200%200%201%205.343.371a.75.75%200%201%201-.186%201.489q-.99-.124-1.99-.206a18.7%2018.7%200%200%201-2.97%206.323q.476.576%201%201.108a.75.75%200%200%201-1.07%201.05A19%2019%200%200%201%209%2013.688a18.8%2018.8%200%200%201-5.656%204.482a.75.75%200%200%201-.688-1.333a17.3%2017.3%200%200%200%205.396-4.353A18.7%2018.7%200%200%201%205.89%208.598a.75.75%200%200%201%201.388-.568A17.2%2017.2%200%200%200%209%2011.224a17.2%2017.2%200%200%200%202.391-5.165a48%2048%200%200%200-8.298.307a.75.75%200%200%201-.186-1.489a49%2049%200%200%201%205.343-.371V3A.75.75%200%200%201%209%202.25M15.75%209a.75.75%200%200%201%20.68.433l5.25%2011.25a.75.75%200%201%201-1.36.634l-1.198-2.567h-6.744l-1.198%202.567a.75.75%200%200%201-1.36-.634l5.25-11.25A.75.75%200%200%201%2015.75%209m-2.672%208.25h5.344l-2.672-5.726z%22%20clip-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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