sfml logo

sfml from Devicon by konpa · Original · MIT Free for personal and commercial use.

Name
sfml
Set
Devicon
Style
Original
Viewbox
128×128
License
MIT

The same logo in other sets

sfmlSimple Icons

Use the sfml logo

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#8cc445" d="M109.558 31.121L84.601 12.948c-15.139-11.025-20.295-15.33-41.593 0L18.05 31.121C2.912 42.147-2.764 45.731 5.2 70.771l9.532 29.404c5.783 17.839 7.43 24.359 33.65 24.504h30.847c18.714 0 25.409.445 33.65-24.504l9.533-29.405c5.783-17.84 8.274-24.083-12.853-39.649"/><path fill="#6fad20" d="M5.212 70.756S2.199 60.006 1.8 56.07l.005-.005c28.503 11.692 69.3 20.76 117.033 25.686l-5.954 18.439c-8.241 24.948-14.936 24.473-33.65 24.473h-30.84c-26.22-.146-27.866-6.633-33.65-24.473z"/><path fill="#fff" d="m81.162 41.401l4.348-16.729h.003l20.638 15.02c4.79 3.296 8.73 6.663 10.034 12.069c1.323 5.482-.493 9.358-1.806 13.41l-10.971 33.928c-1.646 5.583-3.636 10.363-8.362 13.276c-4.793 2.955-9.028 2.447-13.279 2.447h-35.59c-5.812.156-10.96-.216-15.187-3.822c0 0-5.108-7.849-6.422-11.902L13.564 65.171c-1.948-5.5-3.156-10.54-1.037-15.69c2.145-5.214 5.86-7.285 9.299-9.79L42.43 24.707l4.348 16.73A7061 7061 0 0 0 27.545 55.55c.062.312 12.799 40.075 13.847 43.013c0 0 1.486.258 4.55.168h35.822c3.275 0 4.302-.091 4.683-.1c.138-.298 13.144-39.97 14.015-42.947z"/><path fill="#fff" d="M63.17 12.844c-4.61.283-8.515 2.767-12.543 5.867c-.038.03-.065.07-.1.101l11.037 42.595h4.817l11.071-42.595l-.1-.1c-3.44-2.505-6.565-5.4-12.175-5.834a14 14 0 0 0-2.008-.033z"/></svg>

React

import type { SVGProps } from "react";

export function DeviconSfml(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#8cc445" d="M109.558 31.121L84.601 12.948c-15.139-11.025-20.295-15.33-41.593 0L18.05 31.121C2.912 42.147-2.764 45.731 5.2 70.771l9.532 29.404c5.783 17.839 7.43 24.359 33.65 24.504h30.847c18.714 0 25.409.445 33.65-24.504l9.533-29.405c5.783-17.84 8.274-24.083-12.853-39.649"/><path fill="#6fad20" d="M5.212 70.756S2.199 60.006 1.8 56.07l.005-.005c28.503 11.692 69.3 20.76 117.033 25.686l-5.954 18.439c-8.241 24.948-14.936 24.473-33.65 24.473h-30.84c-26.22-.146-27.866-6.633-33.65-24.473z"/><path fill="#fff" d="m81.162 41.401l4.348-16.729h.003l20.638 15.02c4.79 3.296 8.73 6.663 10.034 12.069c1.323 5.482-.493 9.358-1.806 13.41l-10.971 33.928c-1.646 5.583-3.636 10.363-8.362 13.276c-4.793 2.955-9.028 2.447-13.279 2.447h-35.59c-5.812.156-10.96-.216-15.187-3.822c0 0-5.108-7.849-6.422-11.902L13.564 65.171c-1.948-5.5-3.156-10.54-1.037-15.69c2.145-5.214 5.86-7.285 9.299-9.79L42.43 24.707l4.348 16.73A7061 7061 0 0 0 27.545 55.55c.062.312 12.799 40.075 13.847 43.013c0 0 1.486.258 4.55.168h35.822c3.275 0 4.302-.091 4.683-.1c.138-.298 13.144-39.97 14.015-42.947z"/><path fill="#fff" d="M63.17 12.844c-4.61.283-8.515 2.767-12.543 5.867c-.038.03-.065.07-.1.101l11.037 42.595h4.817l11.071-42.595l-.1-.1c-3.44-2.505-6.565-5.4-12.175-5.834a14 14 0 0 0-2.008-.033z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 128 128"><path fill="#8cc445" d="M109.558 31.121L84.601 12.948c-15.139-11.025-20.295-15.33-41.593 0L18.05 31.121C2.912 42.147-2.764 45.731 5.2 70.771l9.532 29.404c5.783 17.839 7.43 24.359 33.65 24.504h30.847c18.714 0 25.409.445 33.65-24.504l9.533-29.405c5.783-17.84 8.274-24.083-12.853-39.649"/><path fill="#6fad20" d="M5.212 70.756S2.199 60.006 1.8 56.07l.005-.005c28.503 11.692 69.3 20.76 117.033 25.686l-5.954 18.439c-8.241 24.948-14.936 24.473-33.65 24.473h-30.84c-26.22-.146-27.866-6.633-33.65-24.473z"/><path fill="#fff" d="m81.162 41.401l4.348-16.729h.003l20.638 15.02c4.79 3.296 8.73 6.663 10.034 12.069c1.323 5.482-.493 9.358-1.806 13.41l-10.971 33.928c-1.646 5.583-3.636 10.363-8.362 13.276c-4.793 2.955-9.028 2.447-13.279 2.447h-35.59c-5.812.156-10.96-.216-15.187-3.822c0 0-5.108-7.849-6.422-11.902L13.564 65.171c-1.948-5.5-3.156-10.54-1.037-15.69c2.145-5.214 5.86-7.285 9.299-9.79L42.43 24.707l4.348 16.73A7061 7061 0 0 0 27.545 55.55c.062.312 12.799 40.075 13.847 43.013c0 0 1.486.258 4.55.168h35.822c3.275 0 4.302-.091 4.683-.1c.138-.298 13.144-39.97 14.015-42.947z"/><path fill="#fff" d="M63.17 12.844c-4.61.283-8.515 2.767-12.543 5.867c-.038.03-.065.07-.1.101l11.037 42.595h4.817l11.071-42.595l-.1-.1c-3.44-2.505-6.565-5.4-12.175-5.834a14 14 0 0 0-2.008-.033z"/></svg>
</template>

CSS

.icon-sfml {
  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%20128%20128%22%3E%3Cpath%20fill%3D%22%238cc445%22%20d%3D%22M109.558%2031.121L84.601%2012.948c-15.139-11.025-20.295-15.33-41.593%200L18.05%2031.121C2.912%2042.147-2.764%2045.731%205.2%2070.771l9.532%2029.404c5.783%2017.839%207.43%2024.359%2033.65%2024.504h30.847c18.714%200%2025.409.445%2033.65-24.504l9.533-29.405c5.783-17.84%208.274-24.083-12.853-39.649%22%2F%3E%3Cpath%20fill%3D%22%236fad20%22%20d%3D%22M5.212%2070.756S2.199%2060.006%201.8%2056.07l.005-.005c28.503%2011.692%2069.3%2020.76%20117.033%2025.686l-5.954%2018.439c-8.241%2024.948-14.936%2024.473-33.65%2024.473h-30.84c-26.22-.146-27.866-6.633-33.65-24.473z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m81.162%2041.401l4.348-16.729h.003l20.638%2015.02c4.79%203.296%208.73%206.663%2010.034%2012.069c1.323%205.482-.493%209.358-1.806%2013.41l-10.971%2033.928c-1.646%205.583-3.636%2010.363-8.362%2013.276c-4.793%202.955-9.028%202.447-13.279%202.447h-35.59c-5.812.156-10.96-.216-15.187-3.822c0%200-5.108-7.849-6.422-11.902L13.564%2065.171c-1.948-5.5-3.156-10.54-1.037-15.69c2.145-5.214%205.86-7.285%209.299-9.79L42.43%2024.707l4.348%2016.73A7061%207061%200%200%200%2027.545%2055.55c.062.312%2012.799%2040.075%2013.847%2043.013c0%200%201.486.258%204.55.168h35.822c3.275%200%204.302-.091%204.683-.1c.138-.298%2013.144-39.97%2014.015-42.947z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M63.17%2012.844c-4.61.283-8.515%202.767-12.543%205.867c-.038.03-.065.07-.1.101l11.037%2042.595h4.817l11.071-42.595l-.1-.1c-3.44-2.505-6.565-5.4-12.175-5.834a14%2014%200%200%200-2.008-.033z%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%20128%20128%22%3E%3Cpath%20fill%3D%22%238cc445%22%20d%3D%22M109.558%2031.121L84.601%2012.948c-15.139-11.025-20.295-15.33-41.593%200L18.05%2031.121C2.912%2042.147-2.764%2045.731%205.2%2070.771l9.532%2029.404c5.783%2017.839%207.43%2024.359%2033.65%2024.504h30.847c18.714%200%2025.409.445%2033.65-24.504l9.533-29.405c5.783-17.84%208.274-24.083-12.853-39.649%22%2F%3E%3Cpath%20fill%3D%22%236fad20%22%20d%3D%22M5.212%2070.756S2.199%2060.006%201.8%2056.07l.005-.005c28.503%2011.692%2069.3%2020.76%20117.033%2025.686l-5.954%2018.439c-8.241%2024.948-14.936%2024.473-33.65%2024.473h-30.84c-26.22-.146-27.866-6.633-33.65-24.473z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22m81.162%2041.401l4.348-16.729h.003l20.638%2015.02c4.79%203.296%208.73%206.663%2010.034%2012.069c1.323%205.482-.493%209.358-1.806%2013.41l-10.971%2033.928c-1.646%205.583-3.636%2010.363-8.362%2013.276c-4.793%202.955-9.028%202.447-13.279%202.447h-35.59c-5.812.156-10.96-.216-15.187-3.822c0%200-5.108-7.849-6.422-11.902L13.564%2065.171c-1.948-5.5-3.156-10.54-1.037-15.69c2.145-5.214%205.86-7.285%209.299-9.79L42.43%2024.707l4.348%2016.73A7061%207061%200%200%200%2027.545%2055.55c.062.312%2012.799%2040.075%2013.847%2043.013c0%200%201.486.258%204.55.168h35.822c3.275%200%204.302-.091%204.683-.1c.138-.298%2013.144-39.97%2014.015-42.947z%22%2F%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M63.17%2012.844c-4.61.283-8.515%202.767-12.543%205.867c-.038.03-.065.07-.1.101l11.037%2042.595h4.817l11.071-42.595l-.1-.1c-3.44-2.505-6.565-5.4-12.175-5.834a14%2014%200%200%200-2.008-.033z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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