Иконка Notebook With Decorative Cover
fluent-emoji:notebook-with-decorative-cover
Иконка Notebook With Decorative Cover (fluent-emoji:notebook-with-decorative-cover) — бесплатная SVG-иконка из набора Fluent Emoji от Microsoft Corporation. Она нарисована на сетке 32 × 32. Fluent Emoji icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах. Скопируйте её как код SVG, JSX, Vue или Svelte или скачайте SVG-файл.
- Набор
- Fluent Emoji
- Автор
- Microsoft Corporation
- Лицензия
- MIT
- Размер
- 32 × 32
- Теги
- notebookwith, withdecorative, decorativecover, notebookwithdecorativecover
Код SVG
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><path fill="url(#iGVaarb)" d="M7.75 2.005h17a2 2 0 0 1 2 2v22h-19z"/><path fill="url(#ip3q7pA)" d="M7.75 2.005h17a2 2 0 0 1 2 2v22h-19z"/><path fill="url(#if4CkEe)" d="M5.25 26.505h21.5v2.5h-.5l-.5.5H5.25z"/><path fill="url(#ihGTcuc)" d="M5.25 26.505h21.5v2.5h-.5l-.5.5H5.25z"/><path fill="url(#i1VEMub)" d="M6.25 2.005a1.5 1.5 0 0 0-1.5 1.5v24.5h1a1 1 0 0 1 1-1h1v-25z"/><path fill="url(#i4zVGsc)" d="M6.25 2.005a1.5 1.5 0 0 0-1.5 1.5v24.5h1a1 1 0 0 1 1-1h1v-25z"/><path fill="url(#iTPNale)" d="M6.25 26.005a1.5 1.5 0 0 0-1.5 1.5v1a1.5 1.5 0 0 0 1.5 1.5h19.408c.653 0 1.092-.335 1.092-1h-20a1 1 0 1 1 0-2h20v-1z"/><rect width="2.575" height="1.272" x="9.452" y="3.631" fill="#CEC8D4" rx=".636" transform="rotate(45 9.452 3.63)"/><rect width="2.575" height="1.272" x="9.452" y="12.645" fill="#CD62AB" rx=".636" transform="rotate(45 9.452 12.645)"/><rect width="2.575" height="1.272" x="9.452" y="21.645" fill="#3E8FD4" rx=".636" transform="rotate(45 9.452 21.645)"/><rect width="2.575" height="1.272" x="20.38" y="3.631" fill="#CBC5D1" rx=".636" transform="rotate(45 20.38 3.63)"/><rect width="2.575" height="1.272" x="20.38" y="12.645" fill="#CB60A9" rx=".636" transform="rotate(45 20.38 12.645)"/><rect width="2.575" height="1.272" x="20.38" y="21.645" fill="#3C8DD1" rx=".636" transform="rotate(45 20.38 21.645)"/><rect width="2.575" height="1.272" fill="#CE62AB" rx=".636" transform="scale(-1 1)rotate(45 -11.19 -14.62)"/><rect width="2.575" height="1.272" fill="#418FD3" rx=".636" transform="scale(-1 1)rotate(45 -22.072 -10.113)"/><rect width="2.575" height="1.272" fill="#CDC7D3" rx=".636" transform="scale(-1 1)rotate(45 -32.936 -5.613)"/><rect width="2.575" height="1.272" fill="#CC61AA" rx=".636" transform="scale(-1 1)rotate(45 -18.68 -16.952)"/><rect width="2.575" height="1.272" x="24.126" y="8.244" fill="#CAC5D1" rx=".636" transform="rotate(45 24.126 8.244)"/><rect width="2.575" height="1.272" fill="#428DD1" rx=".636" transform="matrix(-1 0 0 1 22.128 8.968)"/><rect width="2.575" height="1.272" fill="#CDC7D3" rx=".636" transform="matrix(-1 0 0 1 14.443 8.968)"/><rect width="2.575" height="1.272" fill="#3F8DD2" rx=".636" transform="scale(-1 1)rotate(45 -29.545 -12.452)"/><rect width="2.575" height="1.272" x="24.126" y="17.244" fill="#CA5FA8" rx=".636" transform="rotate(45 24.126 17.244)"/><rect width="2.575" height="1.272" fill="#438FD4" rx=".636" transform="matrix(0 -1 -1 0 10.27 10.892)"/><rect width="2.575" height="1.272" fill="#448ED2" rx=".636" transform="matrix(-1 0 0 1 18.285 4.355)"/><rect width="2.575" height="1.272" fill="#CBC5D1" rx=".636" transform="matrix(-1 0 0 1 22.128 17.968)"/><rect width="2.575" height="1.272" fill="#CFCAD6" rx=".636" transform="matrix(-1 0 0 1 18.285 13.37)"/><rect width="2.575" height="1.272" fill="#CC60A9" rx=".636" transform="matrix(-1 0 0 1 18.285 22.37)"/><rect width="2.575" height="1.272" fill="#CD61AA" rx=".636" transform="matrix(-1 0 0 1 14.443 17.968)"/><rect width="2.575" height="1.272" fill="#CA61A9" rx=".636" transform="matrix(0 -1 -1 0 25.223 6.279)"/><rect width="2.575" height="1.272" fill="#418DD1" rx=".636" transform="matrix(0 -1 -1 0 25.223 15.293)"/><rect width="2.575" height="1.272" fill="#CAC5D1" rx=".636" transform="matrix(0 -1 -1 0 25.223 24.293)"/><rect width="2.575" height="1.272" fill="#CEC8D4" rx=".636" transform="matrix(0 -1 -1 0 10.27 19.892)"/><defs><linearGradient id="iGVaarb" x1="17.25" x2="17.25" y1="2.005" y2="26.005" gradientUnits="userSpaceOnUse"><stop stop-color="#5D4573"/><stop offset="1" stop-color="#4B3E59"/></linearGradient><linearGradient id="ip3q7pA" x1="28.44" x2="25.73" y1="5.387" y2="5.484" gradientUnits="userSpaceOnUse"><stop offset=".409" stop-color="#806E91"/><stop offset="1" stop-color="#806E91" stop-opacity="0"/></linearGradient><linearGradient id="if4CkEe" x1="6.471" x2="26.569" y1="28.42" y2="28.42" gradientUnits="userSpaceOnUse"><stop stop-color="#D6C0EA"/><stop offset="1" stop-color="#DCCCED"/></linearGradient><linearGradient id="ihGTcuc" x1="16" x2="16" y1="26.743" y2="28.162" gradientUnits="userSpaceOnUse"><stop stop-color="#9F8CB4"/><stop offset="1" stop-color="#9F8CB4" stop-opacity="0"/></linearGradient><linearGradient id="i1VEMub" x1="4.955" x2="7.75" y1="16.742" y2="16.742" gradientUnits="userSpaceOnUse"><stop stop-color="#4E4459"/><stop offset="1" stop-color="#453C4E"/></linearGradient><linearGradient id="iTPNale" x1="6.181" x2="26.75" y1="28.969" y2="28.936" gradientUnits="userSpaceOnUse"><stop stop-color="#512F71"/><stop offset="1" stop-color="#4F2E6D"/></linearGradient><radialGradient id="i4zVGsc" cx="0" cy="0" r="1" gradientTransform="matrix(0 -6.6454 1.17096 0 5.149 26.678)" gradientUnits="userSpaceOnUse"><stop stop-color="#51475C"/><stop offset="1" stop-color="#51475C" stop-opacity="0"/></radialGradient></defs></g></svg>Как использовать иконку Notebook With Decorative Cover
React
import { Icon } from "@iconify/react";
<Icon icon="fluent-emoji:notebook-with-decorative-cover" width="24" />Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="fluent-emoji:notebook-with-decorative-cover" width="24" />
</template>Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="fluent-emoji:notebook-with-decorative-cover" width="24" />Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji--notebook-with-decorative-cover]"></span>UnoCSS
<!-- @unocss/preset-icons + @iconify-json/fluent-emoji -->
<div class="i-fluent-emoji:notebook-with-decorative-cover"></div>Веб-компонент
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="fluent-emoji:notebook-with-decorative-cover"></iconify-icon>Изображение HTML
<img src="https://iconyz.com/api/public/svg/fluent-emoji/notebook-with-decorative-cover.svg" alt="Иконка Notebook With Decorative Cover" width="24" height="24">Похожие иконки в наборе Fluent Emoji
Иконка Notebook With Decorative Cover в других наборах
Вопросы и ответы: Иконка Notebook With Decorative Cover
Можно ли бесплатно использовать иконку Notebook With Decorative Cover в коммерческих проектах?
Да. Fluent Emoji icons выпущены под лицензией MIT, которая разрешает использование в личных и коммерческих проектах.
Как использовать иконку Notebook With Decorative Cover в React?
Установите @iconify/react и выведите <Icon icon="fluent-emoji:notebook-with-decorative-cover" /> или нажмите «Копировать код» на этой странице, чтобы получить отдельный React-компонент.
Как добавить иконку Notebook With Decorative Cover на веб-страницу?
Подключите SVG-файл в теге изображения: <img src="https://iconyz.com/api/public/svg/fluent-emoji/notebook-with-decorative-cover.svg" alt="Иконка Notebook With Decorative Cover">, или вставьте SVG-код прямо в страницу, чтобы стилизовать его через CSS.