ruler icon

ruler from Font Awesome Solid by Dave Gandy · Solid · Construction · CC-BY-4.0 Attribution required.

Name
ruler
Set
Font Awesome Solid
Style
Solid
Category
Construction
Viewbox
640×640
License
CC BY 4.0

The same icon in other sets

rulerBoxIcons v2rulerBoxIcons v2 SolidrulerCarbonrulerFont Awesome 6 Solidruler-12-filledFluent UI System Iconsrulercss.ggrulerHuge IconsrulerIconParkrulerIconPark OutlinerulerIconoirrulerJam IconsrulerLine AwesomerulerLuciderulerMaterial Design Iconsruler-fillMingCute IconrulerMyna UI IconsrulerPhosphorruler-fillRemix Iconruler-boldSolarrulerTabler IconsrulerTDesign IconsrulerUniconsrulerUnicons MonochromerulerUnicons Solid

More construction icons from Font Awesome Solid

brushdrafting-compassdumpsterhammerhard-hatpaint-rollerpencil-rulerruler-combinedruler-horizontalruler-verticalscrewdrivertoolboxtoolswrench

Use the ruler icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M241.1 580.2c-18.7 18.7-49.1 18.7-67.9 0L60.1 467.1c-18.7-18.7-18.7-49.1 0-67.9l17-17l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9L111 348.3l33.9-33.9l50.9 50.9c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-50.9-50.9l33.9-33.9l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-73.5-73.5l33.9-33.9l50.9 50.9c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-50.9-50.9l33.9-33.9l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-73.5-73.5l17-17c18.7-18.7 49.1-18.7 67.9 0l113.4 112.8c18.7 18.7 18.7 49.1 0 67.9z"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidRuler(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M241.1 580.2c-18.7 18.7-49.1 18.7-67.9 0L60.1 467.1c-18.7-18.7-18.7-49.1 0-67.9l17-17l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9L111 348.3l33.9-33.9l50.9 50.9c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-50.9-50.9l33.9-33.9l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-73.5-73.5l33.9-33.9l50.9 50.9c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-50.9-50.9l33.9-33.9l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-73.5-73.5l17-17c18.7-18.7 49.1-18.7 67.9 0l113.4 112.8c18.7 18.7 18.7 49.1 0 67.9z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M241.1 580.2c-18.7 18.7-49.1 18.7-67.9 0L60.1 467.1c-18.7-18.7-18.7-49.1 0-67.9l17-17l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9L111 348.3l33.9-33.9l50.9 50.9c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-50.9-50.9l33.9-33.9l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-73.5-73.5l33.9-33.9l50.9 50.9c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-50.9-50.9l33.9-33.9l73.5 73.5c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-73.5-73.5l17-17c18.7-18.7 49.1-18.7 67.9 0l113.4 112.8c18.7 18.7 18.7 49.1 0 67.9z"/></svg>
</template>

CSS

.icon-ruler {
  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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M241.1%20580.2c-18.7%2018.7-49.1%2018.7-67.9%200L60.1%20467.1c-18.7-18.7-18.7-49.1%200-67.9l17-17l73.5%2073.5c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9L111%20348.3l33.9-33.9l50.9%2050.9c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-50.9-50.9l33.9-33.9l73.5%2073.5c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-73.5-73.5l33.9-33.9l50.9%2050.9c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-50.9-50.9l33.9-33.9l73.5%2073.5c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-73.5-73.5l17-17c18.7-18.7%2049.1-18.7%2067.9%200l113.4%20112.8c18.7%2018.7%2018.7%2049.1%200%2067.9z%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%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M241.1%20580.2c-18.7%2018.7-49.1%2018.7-67.9%200L60.1%20467.1c-18.7-18.7-18.7-49.1%200-67.9l17-17l73.5%2073.5c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9L111%20348.3l33.9-33.9l50.9%2050.9c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-50.9-50.9l33.9-33.9l73.5%2073.5c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-73.5-73.5l33.9-33.9l50.9%2050.9c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-50.9-50.9l33.9-33.9l73.5%2073.5c9.4%209.4%2024.6%209.4%2033.9%200s9.4-24.6%200-33.9l-73.5-73.5l17-17c18.7-18.7%2049.1-18.7%2067.9%200l113.4%20112.8c18.7%2018.7%2018.7%2049.1%200%2067.9z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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