Diploma Scroll icon

vaadin:diploma-scroll

The Diploma Scroll icon (vaadin:diploma-scroll) is a free SVG icon from the Vaadin Icons set by Vaadin. It is drawn on a 24 × 24 grid. Vaadin Icons are released under the Apache 2.0 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: Vaadin Icons
Author: Vaadin
License: Apache-2.0
Size: 24 × 24
Tags: diplomascroll

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="currentColor" d="M12.61 8.41a5.5 5.5 0 0 1-1.454-.424A60 60 0 0 1 15.61 4.43l.1-.07l.06-.11a2.924 2.924 0 0 0-.765-3.496a2.92 2.92 0 0 0-3.459-.376l-.126.133A55 55 0 0 1 6.512 6.41a50 50 0 0 1-6.018 4.592L.1 11.25v.23a4.53 4.53 0 0 0 .7 3.655A2.83 2.83 0 0 0 3.007 16a2 2 0 0 0 1.778-.902C5.03 14.79 6.85 12.49 8.79 10.39c.268.464.476 1.003.594 1.575a6.3 6.3 0 0 1-.399 3.078L10.67 13L12 14a12.1 12.1 0 0 0-.584-3.336a5.3 5.3 0 0 0-.915-1.214c.406.346.871.643 1.372.874c.94.338 1.989.572 3.076.672L14 9.73L16 8a9 9 0 0 1-2.777.431q-.324 0-.642-.022zm-.45-7.23a1.9 1.9 0 0 1 .842-.194c.506 0 .966.196 1.309.516a1.93 1.93 0 0 1 .595 2.192c-.486.307-2.346 1.717-4.146 3.307a2 2 0 0 0-.668-1.298a1.6 1.6 0 0 0-1.24-.372A58 58 0 0 0 12.16 1.18M2.7 11.81a.46.46 0 0 1 .262-.082l.04.002h.068c.179.052.334.142.461.261l-.871.719a1.3 1.3 0 0 1-.119-.716a.33.33 0 0 1 .158-.183zM4 14.5a1 1 0 0 1-1.005.499a1.85 1.85 0 0 1-1.485-.54a3.43 3.43 0 0 1-.583-1.922q.001-.377.077-.73l.706-.457c-.094.14-.164.304-.199.481a3 3 0 0 0 .535 1.958l.354.44l1.7-1.4a2.4 2.4 0 0 1-.106 1.685zm.86-2.45a2.83 2.83 0 0 0-1.54-1.274c-.071-.012-.13-.016-.19-.016s-.119.004-.177.01a1.6 1.6 0 0 0-.35 0a45 45 0 0 0 3.988-3.052c.398.071.812.25 1.131.533c.297.313.48.739.48 1.209l-.002.094a54 54 0 0 0-3 3.506a2.8 2.8 0 0 0-.357-1.023z"/></svg>

How to use the Diploma Scroll icon

React

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

<Icon icon="vaadin:diploma-scroll" width="24" />

Vue

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

<template>
  <Icon icon="vaadin:diploma-scroll" width="24" />
</template>

Svelte

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

<Icon icon="vaadin:diploma-scroll" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[vaadin--diploma-scroll]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/vaadin -->
<div class="i-vaadin:diploma-scroll"></div>

Web component

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

<iconify-icon icon="vaadin:diploma-scroll"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/vaadin/diploma-scroll.svg" alt="Diploma Scroll icon" width="24" height="24">

Related icons in Vaadin Icons

Diploma Scroll icon in other icon sets

Diploma Scroll icon FAQ

Is the Diploma Scroll icon free for commercial use?

Yes. Vaadin Icons are released under the Apache 2.0 license, which allows use in personal and commercial projects.

How do I use the Diploma Scroll icon in React?

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

How do I add the Diploma Scroll icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/vaadin/diploma-scroll.svg" alt="Diploma Scroll icon">, or paste the SVG code inline to style it with CSS.

Browse all Vaadin Icons →