Skip to content
shadcn.io

Flat Ui

The Flat UI icon represents the Flat UI design language, a popular design style for user interfaces.

Add shadcn.io to your AI agent. · Pro It installs Flat Ui, or any of 294k icons, from a prompt, with Pro.

Set up MCP

Exports at 32 × 24 px

Flat Ui icon from SVG Logos
Get Pro

2,063 in SVG LogosCC0 license (opens in a new tab)Free to copy and download

Code

Flat Ui in your framework

In any framework. Customize it above, and the code follows.

export const FlatUiIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="32" height="24" viewBox="0 0 256 194" {...props}>
    <defs><clipPath id="SVG4X2u6c3Y"><path d="M68.367 0a13.65 13.65 0 0 0-9.664 4.011L2.087 60.783a7.15 7.15 0 0 0 .004 10.102l120.668 120.836a7.15 7.15 0 0 0 10.112.007L253.903 70.864a7.15 7.15 0 0 0 .03-10.087L197.836 4.052A13.64 13.64 0 0 0 188.132 0z"/></clipPath></defs><g clipPath="url(#SVG4X2u6c3Y)"><path fill="#57BBFB" d="M65.4-.004h125.718a6.5 6.5 0 0 1 4.62 1.93l63.2 63.906l-131.125 130.944L-2.95 65.832L60.8 1.905a6.5 6.5 0 0 1 4.6-1.909"/><path fill="#48ACEC" d="M194.649 1.045a6.5 6.5 0 0 0-3.531-1.05H65.4a6.5 6.5 0 0 0-4.602 1.91l2.086 2.638l31.919 31.372l66.29-.273z"/><path fill="#2B8FCF" d="m128.405 196.185l-.592.592L-2.95 65.832l1.104-1.106H67.25l61.154 127.777z"/><path fill="#2D91D1" d="m84.478 109.075l10.873 22.05h65.567l10.776-21.548l-44.206-43.935z"/><path fill="#7ACBFF" d="M193.848 65.642h64.931L193.375.042l-32.826 32.683z"/><path fill="#55B9F9" d="M160.549 32.726L127.904.456L95.162 33.284l32.327 32.36z"/><path fill="#3B9FDF" d="M127.488 65.642H62.886l21.592 43.44l43.01-43.435l44.207 43.936l22.153-43.94z"/><path fill="#52B6F7" d="M62.886 65.642h64.602l-32.326-32.36z"/><path fill="#8FD3FF" d="m160.549 32.726l-33.06 32.917h66.359v-.001z"/><path fill="#FF2690" d="M160.549 32.726L127.904.456z"/><path fill="#41A5E5" d="M95.162 33.283L62.636.723l-65.54 64.92h65.79v-.001z"/><path fill="#3CA0E0" d="m127.903 197.14l33.015-66.015H95.351z"/><path fill="#4EB2F2" d="m171.695 109.578l-10.776 21.548h32.457z"/><path fill="#1A7EBE" d="M62.643 131.125h32.708l-10.873-22.05z"/><path fill="#FFF" d="M177.459 65.124c5.336-1.131 15.08-10.956 15.932-15.768c.044-.248.445-.245.517-.005c1.464 4.915 11.434 14.847 15.844 15.773c.258.054.288.902.03.96c-4.556 1.032-14.488 11.062-15.86 15.85c-.075.26-.494.263-.557-.001c-1.09-4.555-10.807-14.497-15.937-15.85c-.257-.067-.23-.904.03-.96"/></g>
  </svg>
);

SVG Logos

Icons that share its tags, in the same style.

  • Element icon from SVG Logos
  • Invision icon from SVG Logos
  • Invision Icon icon from SVG Logos
  • Ampersand icon from SVG Logos
  • Eager icon from SVG Logos
  • Ant Design icon from SVG Logos
  • Dropzone icon from SVG Logos
  • Effector icon from SVG Logos
  • Elasticbox icon from SVG Logos
  • Glint icon from SVG Logos
  • Glitch Icon icon from SVG Logos
  • Gnome Icon icon from SVG Logos
  • Gnupg Icon icon from SVG Logos
  • Naiveui icon from SVG Logos
  • Percy Icon icon from SVG Logos
  • Perplexity Icon icon from SVG Logos
  • Protoio icon from SVG Logos
  • Prott icon from SVG Logos
  • Sagui icon from SVG Logos
  • Unito Icon icon from SVG Logos
  • 6px icon from SVG Logos
  • Arc icon from SVG Logos
  • Imba Icon icon from SVG Logos
  • Lateral Icon icon from SVG Logos

Skip the copy and paste. With Pro, your AI agent finds and installs any SVG Logos icon from a prompt.

Get Pro

Tags

Browse by tag

Flat Ui is tagged UI, interface, design and 4 more. Related tags follow; each opens its icons from every library.

Pricing

SVG Logos MCP, with Pro

Ask for Flat Ui or any of 2,063 SVG Logos icons and your agent installs it. The MCP comes with every Pro plan, with 6,000+ blocks and 14 premium templates. The icons stay free.

4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.

Billed once a year in USD. Cancel anytime.

Individual

For personal projects & open source

$32instead of $49/mo

$389 billed yearly

  • How many people can use the license.Seats: 1 seat
  • Client work, SaaS products and anything you charge for.Commercial use: Personal & open source only
  • Production-ready React sections: hero, pricing, features, dashboards and more.Pro blocks: 6,000+ blocks
  • Complete multi-page sites you can ship as they are.Templates: All 14 templates
  • React icons from every major library, installable with one command.React icons: 294k+ icons
  • Presets that restyle every block, in light and dark.Themes: All 59 themes
  • Lets your AI editor search, preview and install blocks for you.MCP server: Basic usage
  • Priority requests are answered first.Support: Standard

Team

Most popular

For freelancers, agencies & startups

$66instead of $99/mo

$789 billed yearly · ≈ $13/dev/mo

Everything in Individual, plus

  • How many people can use the license.Seats: Up to 5 seats
  • Client work, SaaS products and anything you charge for.Commercial use: Included
  • Lets your AI editor search, preview and install blocks for you.MCP server: High usage
  • Priority requests are answered first.Support: Priority

Organization

For companies with larger teams

$132instead of $199/mo

$1,589 billed yearly

Everything in Team, plus

  • How many people can use the license.Seats: Unlimited seats
  • Lets your AI editor search, preview and install blocks for you.MCP server: Unlimited usage
  • Secure checkout via Stripe
  • Code lives in your repo
  • Keep what you've shipped if you cancel
  • License terms

FAQ

Frequently asked questions

What the Flat Ui icon means and where it's used, then how to install, style and license it.

Install Flat Ui from a prompt

MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.

Get Pro