☰
UI Design Symbols
Embed This Widget
Add the script tag and a data attribute to embed this widget.
Embed via iframe for maximum compatibility.
<iframe src="https://unicodefyi.com/iframe/entity//" width="420" height="400" frameborder="0" style="border:0;border-radius:10px;max-width:100%" loading="lazy"></iframe>
Paste this URL in WordPress, Medium, or any oEmbed-compatible platform.
https://unicodefyi.com/entity//
Add a dynamic SVG badge to your README or docs.
[](https://unicodefyi.com/entity//)
Use the native HTML custom element.
29 characters
Unicode symbols commonly used in user interface and UX design for icons, controls, and navigation elements. Includes hamburger menus, close buttons, search icons, settings gear, arrows, and media controls that represent standard UI patterns.
Characters
copied = '', 1500)
"
:class="copied === 'U+2630' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
☰
copied = '', 1500)
"
:class="copied === 'U+2715' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
✕
copied = '', 1500)
"
:class="copied === 'U+2716' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
✖
copied = '', 1500)
"
:class="copied === 'U+1F50D' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
🔍
copied = '', 1500)
"
:class="copied === 'U+1F50E' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
🔎
copied = '', 1500)
"
:class="copied === 'U+2699' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⚙
copied = '', 1500)
"
:class="copied === 'U+2302' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⌂
copied = '', 1500)
"
:class="copied === 'U+1F464' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
👤
copied = '', 1500)
"
:class="copied === 'U+1F465' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
👥
copied = '', 1500)
"
:class="copied === 'U+2709' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
✉
copied = '', 1500)
"
:class="copied === 'U+1F514' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
🔔
copied = '', 1500)
"
:class="copied === 'U+1F515' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
🔕
copied = '', 1500)
"
:class="copied === 'U+2195' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
↕
copied = '', 1500)
"
:class="copied === 'U+2194' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
↔
copied = '', 1500)
"
:class="copied === 'U+21BB' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
↻
copied = '', 1500)
"
:class="copied === 'U+21BA' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
↺
copied = '', 1500)
"
:class="copied === 'U+2B06' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⬆
copied = '', 1500)
"
:class="copied === 'U+2B07' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⬇
copied = '', 1500)
"
:class="copied === 'U+25B6' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
▶
copied = '', 1500)
"
:class="copied === 'U+23F8' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⏸
copied = '', 1500)
"
:class="copied === 'U+23F9' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⏹
copied = '', 1500)
"
:class="copied === 'U+23FA' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⏺
copied = '', 1500)
"
:class="copied === 'U+2795' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
➕
copied = '', 1500)
"
:class="copied === 'U+2796' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
➖
copied = '', 1500)
"
:class="copied === 'U+270F' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
✏
copied = '', 1500)
"
:class="copied === 'U+1F5D1' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
🗑
copied = '', 1500)
"
:class="copied === 'U+2611' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
☑
copied = '', 1500)
"
:class="copied === 'U+22EE' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⋮
copied = '', 1500)
"
:class="copied === 'U+22EF' ? 'bg-green-100 dark:bg-green-900 border-green-400' : ''">
⋯
Copied! Click character name to view full details.