ICONYZ
English
Open Materials icon from Academicons

Open Materials icon

academicons:open-materials

The Open Materials icon (academicons:open-materials) is a free SVG icon from the Academicons set by James Walsh. It is drawn on a 512 × 512 grid. Academicons are released under the Open Font License, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set
Academicons
Author
James Walsh
License
OFL-1.1
Size
512 × 512
Tags
openmaterials, material
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="currentColor" d="M255.99 8c-14.46 0-28.915 3.167-39.89 9.51L69.398 102.207c-21.941 12.675-39.89 43.754-39.89 69.084v169.42c0 25.336 17.949 56.425 39.89 69.094l146.704 84.714c10.974 6.324 25.436 9.482 39.89 9.482c14.465 0 28.928-3.158 39.889-9.482l146.723-84.714c21.935-12.669 39.89-43.758 39.89-69.094V171.29c0-25.33-17.955-56.41-39.89-69.084L295.89 17.511C284.916 11.167 270.456 8 255.99 8m-58.058 145.737L256 176.605l58.096-22.868l100.08 40.8l-58.068 22.857v100.098L256 358.272l-100.098-40.78V217.394l-58.087-22.858Zm-42.03 63.657L256 258.164l100.108-40.77L256 176.604Z"/></svg>

How to use the Open Materials icon

React

import { Icon } from "@iconify/react";

<Icon icon="academicons:open-materials" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="academicons:open-materials" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="academicons:open-materials" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[academicons--open-materials]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/academicons -->
<div class="i-academicons:open-materials"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="academicons:open-materials"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/academicons/open-materials.svg" alt="Open Materials icon" width="24" height="24">

Related icons in Academicons

open-access icon
open-access
 open-access-square icon
open-access-square
 open-data icon
open-data
 open-data-square icon
open-data-square
 open-materials-square icon
open-materials-square
 openedition icon
openedition
 openedition-square icon
openedition-square

Open Materials icon FAQ

Is the Open Materials icon free for commercial use?

Yes. Academicons are released under the Open Font License, which allows use in personal and commercial projects.

How do I use the Open Materials icon in React?

Install @iconify/react and render <Icon icon="academicons:open-materials" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Open Materials icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/academicons/open-materials.svg" alt="Open Materials icon">, or paste the SVG code inline to style it with CSS.

Browse all Academicons →