ICONYZ
Bahasa Indonesia
Ikon Pager dari Fluent Emoji

Ikon Pager

fluent-emoji:pager

Ikon Pager (fluent-emoji:pager) adalah ikon SVG gratis dari set Fluent Emoji karya Microsoft Corporation. Ikon ini digambar pada grid 32 × 32. Fluent Emoji icons dirilis di bawah lisensi MIT, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial. Salin sebagai kode SVG, JSX, Vue, atau Svelte, atau unduh file SVG-nya.

Set ikon
Fluent Emoji
Pembuat
Microsoft Corporation
Lisensi
MIT
Ukuran
32 × 32
Download SVG

Kode SVG

<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><g fill="none"><g filter="url(#iFIBuPb)"><path fill="url(#ijgguqH)" d="M2.023 11.531a2.5 2.5 0 0 1 2.5-2.5h22.954a2.5 2.5 0 0 1 2.5 2.5v15.922a2.5 2.5 0 0 1-2.5 2.5H4.523a2.5 2.5 0 0 1-2.5-2.5z"/><path fill="url(#ik56B9c)" d="M2.023 11.531a2.5 2.5 0 0 1 2.5-2.5h22.954a2.5 2.5 0 0 1 2.5 2.5v15.922a2.5 2.5 0 0 1-2.5 2.5H4.523a2.5 2.5 0 0 1-2.5-2.5z"/></g><g stroke-width=".8" filter="url(#ipkfL7c)"><path stroke="url(#itWTR7c)" d="M4.273 12.056a.9.9 0 0 1 .9-.9h21.794a.9.9 0 0 1 .9.9v9.888a.9.9 0 0 1-.9.9H5.173a.9.9 0 0 1-.9-.9z"/><path stroke="url(#iIwgTNe)" d="M4.273 12.056a.9.9 0 0 1 .9-.9h21.794a.9.9 0 0 1 .9.9v9.888a.9.9 0 0 1-.9.9H5.173a.9.9 0 0 1-.9-.9z"/><path stroke="url(#iXApqKd)" d="M4.273 12.056a.9.9 0 0 1 .9-.9h21.794a.9.9 0 0 1 .9.9v9.888a.9.9 0 0 1-.9.9H5.173a.9.9 0 0 1-.9-.9z"/></g><g filter="url(#iwhGv1b)"><path stroke="#2E5D4B" stroke-width=".2" d="M4.273 12.056a.9.9 0 0 1 .9-.9h21.794a.9.9 0 0 1 .9.9v9.888a.9.9 0 0 1-.9.9H5.173a.9.9 0 0 1-.9-.9z"/></g><g filter="url(#igXRFod)"><path fill="url(#iZq1Lqe)" d="M4.273 12.056a.9.9 0 0 1 .9-.9h21.794a.9.9 0 0 1 .9.9v9.888a.9.9 0 0 1-.9.9H5.173a.9.9 0 0 1-.9-.9z"/><path fill="url(#iRxjexe)" d="M4.273 12.056a.9.9 0 0 1 .9-.9h21.794a.9.9 0 0 1 .9.9v9.888a.9.9 0 0 1-.9.9H5.173a.9.9 0 0 1-.9-.9z"/></g><path fill="#3A887A" d="M8.586 14.484a.984.984 0 1 1 1.969 0V15.5a.984.984 0 1 1-1.97 0z"/><path fill="#3B897C" d="M8.586 18.5a.984.984 0 1 1 1.969 0v1.016a.984.984 0 1 1-1.97 0z"/><path fill="#3B897B" d="M12.617 14.484a.984.984 0 1 1 1.969 0V15.5a.984.984 0 1 1-1.969 0z"/><path fill="#3C897C" d="M12.617 18.5a.984.984 0 1 1 1.969 0v1.016a.984.984 0 1 1-1.969 0z"/><path fill="#3B897B" d="M17.566 14.484a.984.984 0 1 1 1.97 0V15.5a.984.984 0 0 1-1.97 0z"/><path fill="#3B897C" d="M17.566 18.5a.984.984 0 1 1 1.97 0v1.016a.984.984 0 0 1-1.97 0z"/><path fill="#3B897B" d="M21.598 14.484a.984.984 0 1 1 1.968 0V15.5a.984.984 0 1 1-1.968 0z"/><path fill="#3C897C" d="M21.598 18.5a.984.984 0 1 1 1.968 0v1.016a.984.984 0 1 1-1.968 0z"/><g filter="url(#iX8i7Gb)"><path fill="#E1D9EA" d="M4.031 26.469A1.47 1.47 0 0 1 5.5 25h4.96a1.469 1.469 0 1 1 0 2.938H5.5a1.47 1.47 0 0 1-1.469-1.47"/></g><g filter="url(#iJMagte)"><path fill="#E1D9EA" d="M13.531 26.469A1.47 1.47 0 0 1 15 25h4.96a1.469 1.469 0 1 1 0 2.938H15a1.47 1.47 0 0 1-1.469-1.47"/></g><g filter="url(#iKzP8Tc)"><path fill="#F53D67" d="M23.031 26.469A1.47 1.47 0 0 1 24.5 25h1.977a1.469 1.469 0 0 1 0 2.938H24.5a1.47 1.47 0 0 1-1.469-1.47"/><path fill="url(#imKGssc)" d="M23.031 26.469A1.47 1.47 0 0 1 24.5 25h1.977a1.469 1.469 0 0 1 0 2.938H24.5a1.47 1.47 0 0 1-1.469-1.47"/></g><g filter="url(#ieG1GZb)"><path stroke="url(#i28sVdc)" stroke-width=".75" d="M4.031 10.188h23.555a1.5 1.5 0 0 1 1.5 1.5v15.804c.008.315-.16.945-.895.945"/></g><defs><filter id="iFIBuPb" width="28.953" height="22.422" x="2.023" y="8.031" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy=".5"/><feGaussianBlur stdDeviation=".5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.372549 0 0 0 0 0.27451 0 0 0 0 0.458824 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_19194"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="1" dy="-1"/><feGaussianBlur stdDeviation=".5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.231373 0 0 0 0 0.192157 0 0 0 0 0.254902 0 0 0 1 0"/><feBlend in2="effect1_innerShadow_18_19194" result="effect2_innerShadow_18_19194"/></filter><filter id="ipkfL7c" width="24.994" height="13.088" x="3.573" y="10.456" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_19194" stdDeviation=".15"/></filter><filter id="iwhGv1b" width="24.194" height="12.287" x="3.973" y="10.856" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_19194" stdDeviation=".1"/></filter><filter id="igXRFod" width="24.094" height="12.188" x="3.773" y="11.156" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-.5" dy=".5"/><feGaussianBlur stdDeviation=".5"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.262745 0 0 0 0 0.764706 0 0 0 0 0.486275 0 0 0 1 0"/><feBlend in2="shape" result="effect1_innerShadow_18_19194"/></filter><filter id="iX8i7Gb" width="8.698" height="4.037" x="3.531" y="24.4" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-.1" dy=".1"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix values="0 0 0 0 0.211765 0 0 0 0 0.156863 0 0 0 0 0.262745 0 0 0 1 0"/><feBlend in2="BackgroundImageFix" result="effect1_dropShadow_18_19194"/><feBlend in="SourceGraphic" in2="effect1_dropShadow_18_19194" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy=".3"/><feGaussianBlur stdDeviation=".3"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.960784 0 0 0 0 0.929412 0 0 0 0 0.996078 0 0 0 1 0"/><feBlend in2="shape" result="effect2_innerShadow_18_19194"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="-.6"/><feGaussianBlur stdDeviation=".6"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.780392 0 0 0 0 0.670588 0 0 0 0 0.878431 0 0 0 1 0"/><feBlend in2="effect2_innerShadow_18_19194" result="effect3_innerShadow_18_19194"/></filter><filter id="iJMagte" width="8.698" height="4.037" x="13.031" y="24.4" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-.1" dy=".1"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix values="0 0 0 0 0.211765 0 0 0 0 0.156863 0 0 0 0 0.262745 0 0 0 1 0"/><feBlend in2="BackgroundImageFix" result="effect1_dropShadow_18_19194"/><feBlend in="SourceGraphic" in2="effect1_dropShadow_18_19194" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy=".3"/><feGaussianBlur stdDeviation=".3"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.960784 0 0 0 0 0.929412 0 0 0 0 0.996078 0 0 0 1 0"/><feBlend in2="shape" result="effect2_innerShadow_18_19194"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="-.6"/><feGaussianBlur stdDeviation=".6"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.780392 0 0 0 0 0.670588 0 0 0 0 0.878431 0 0 0 1 0"/><feBlend in2="effect2_innerShadow_18_19194" result="effect3_innerShadow_18_19194"/></filter><filter id="iKzP8Tc" width="5.714" height="4.037" x="22.531" y="24.4" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dx="-.1" dy=".1"/><feGaussianBlur stdDeviation=".2"/><feComposite in2="hardAlpha" operator="out"/><feColorMatrix values="0 0 0 0 0.211765 0 0 0 0 0.156863 0 0 0 0 0.262745 0 0 0 1 0"/><feBlend in2="BackgroundImageFix" result="effect1_dropShadow_18_19194"/><feBlend in="SourceGraphic" in2="effect1_dropShadow_18_19194" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy=".3"/><feGaussianBlur stdDeviation=".3"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.94902 0 0 0 0 0.192157 0 0 0 0 0.478431 0 0 0 1 0"/><feBlend in2="shape" result="effect2_innerShadow_18_19194"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="-.6"/><feGaussianBlur stdDeviation=".6"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0.862745 0 0 0 0 0.101961 0 0 0 0 0.286275 0 0 0 1 0"/><feBlend in2="effect2_innerShadow_18_19194" result="effect3_innerShadow_18_19194"/></filter><filter id="ieG1GZb" width="26.93" height="20.5" x="3.281" y="9.063" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur result="effect1_foregroundBlur_18_19194" stdDeviation=".375"/></filter><linearGradient id="ijgguqH" x1="16" x2="16" y1="9.031" y2="29.953" gradientUnits="userSpaceOnUse"><stop stop-color="#5F4675"/><stop offset="1" stop-color="#50425D"/></linearGradient><linearGradient id="itWTR7c" x1="16.07" x2="16.07" y1="11.156" y2="22.844" gradientUnits="userSpaceOnUse"><stop stop-color="#543576"/><stop offset="1" stop-color="#42384F"/></linearGradient><linearGradient id="iIwgTNe" x1="3.93" x2="18.398" y1="19.313" y2="15.969" gradientUnits="userSpaceOnUse"><stop offset=".065" stop-color="#6E6479"/><stop offset=".342" stop-color="#6E6479" stop-opacity="0"/></linearGradient><linearGradient id="iXApqKd" x1="14.961" x2="14.961" y1="23.406" y2="22.953" gradientUnits="userSpaceOnUse"><stop offset=".194" stop-color="#6E6479"/><stop offset="1" stop-color="#6E6479" stop-opacity="0"/></linearGradient><linearGradient id="iZq1Lqe" x1="12.242" x2="25.497" y1="22.188" y2="7.901" gradientUnits="userSpaceOnUse"><stop stop-color="#4DE399"/><stop offset="1" stop-color="#47C282"/></linearGradient><linearGradient id="iRxjexe" x1="18.242" x2="18.242" y1="24.031" y2="20.688" gradientUnits="userSpaceOnUse"><stop stop-color="#4BE18C"/><stop offset="1" stop-color="#4DE299" stop-opacity="0"/></linearGradient><linearGradient id="i28sVdc" x1="29.086" x2="16.652" y1="9.597" y2="28.711" gradientUnits="userSpaceOnUse"><stop stop-color="#837196"/><stop offset=".873" stop-color="#837196" stop-opacity="0"/></linearGradient><radialGradient id="ik56B9c" cx="0" cy="0" r="1" gradientTransform="rotate(138.468 12.938 10.526)scale(1.69894 2.96575)" gradientUnits="userSpaceOnUse"><stop offset=".303" stop-color="#847297"/><stop offset="1" stop-color="#847297" stop-opacity="0"/></radialGradient><radialGradient id="imKGssc" cx="0" cy="0" r="1" gradientTransform="matrix(-1.0625 .75 -1.32247 -1.87348 27.648 25.719)" gradientUnits="userSpaceOnUse"><stop offset=".214" stop-color="#FF6588"/><stop offset="1" stop-color="#FF6588" stop-opacity="0"/></radialGradient></defs></g></svg>

Cara memakai ikon Pager

React

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

<Icon icon="fluent-emoji:pager" width="24" />

Vue

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

<template>
  <Icon icon="fluent-emoji:pager" width="24" />
</template>

Svelte

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

<Icon icon="fluent-emoji:pager" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[fluent-emoji--pager]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/fluent-emoji -->
<div class="i-fluent-emoji:pager"></div>

Web component

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

<iconify-icon icon="fluent-emoji:pager"></iconify-icon>

Gambar HTML

<img src="https://iconyz.com/api/public/svg/fluent-emoji/pager.svg" alt="Ikon Pager" width="24" height="24">

Ikon Pager di set ikon lain

FAQ Ikon Pager

Apakah ikon Pager gratis untuk penggunaan komersial?

Ya. Fluent Emoji icons dirilis di bawah lisensi MIT, yang mengizinkan penggunaan dalam proyek pribadi maupun komersial.

Bagaimana cara memakai ikon Pager di React?

Pasang @iconify/react lalu render <Icon icon="fluent-emoji:pager" />, atau gunakan “Salin kode” di halaman ini untuk mendapatkan komponen React mandiri.

Bagaimana cara menambahkan ikon Pager ke halaman web?

Tautkan file SVG di tag gambar: <img src="https://iconyz.com/api/public/svg/fluent-emoji/pager.svg" alt="Ikon Pager">, atau tempel kode SVG langsung di halaman untuk menatanya dengan CSS.

Lihat semua Ikon Fluent Emoji →