Skip to content
shadcn.io

Headlessui Icon

The Headlessui-icon icon represents a specific variation of the Headless UI icon.

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

Set up MCP

Exports at 24 × 24 px

Headlessui Icon icon from SVG Logos
Get Pro

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

Code

Headlessui Icon in your framework

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

export const HeadlessuiIconIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 256 256" {...props}>
    <defs><linearGradient id="SVGpwg2jd2i" x1="35.871%" x2="60.314%" y1="7.224%" y2="115.988%"><stop offset="0%" stopColor="#66E3FF"/><stop offset="100%" stopColor="#7064F9"/></linearGradient><linearGradient id="SVGs4DWDcmJ" x1="39.172%" x2="55.05%" y1="0%" y2="99.181%"><stop offset="0%" stopColor="#66E3FF"/><stop offset="100%" stopColor="#7064F9"/></linearGradient></defs><path fill="url(#SVGpwg2jd2i)" d="m50.699 159.089l156.225-52.153c-3.122-19.523-5.346-32.565-7.924-42.518c-2.777-10.706-4.978-13.57-5.842-14.563a30.5 30.5 0 0 0-10.973-7.969c-1.216-.52-4.625-1.728-15.654-1.064c-11.669.704-26.987 3.088-51.245 6.929c-24.25 3.84-39.56 6.313-50.87 9.241c-10.7 2.777-13.573 4.985-14.566 5.85a30.6 30.6 0 0 0-7.963 10.97c-.52 1.215-1.729 4.624-1.064 15.658c.704 11.665 3.089 26.988 6.93 51.24c1.073 6.8 2.041 12.882 2.946 18.379"/><path fill="url(#SVGs4DWDcmJ)" d="M7.625 147.063c-7.427-46.92-11.149-70.38-3.098-89.214a71.1 71.1 0 0 1 18.6-25.605c15.423-13.466 38.88-17.178 85.796-24.611C155.854.19 179.313-3.521 198.16 4.528a71.1 71.1 0 0 1 25.595 18.595c13.477 15.426 17.19 38.886 24.618 85.814c7.435 46.92 11.149 70.387 3.097 89.214a71.1 71.1 0 0 1-18.591 25.604c-15.423 13.474-38.889 17.187-85.812 24.62c-46.916 7.433-70.382 11.146-89.213 3.096a71.1 71.1 0 0 1-25.595-18.595C18.781 217.45 15.068 193.99 7.633 147.063zm82.762 83.325c12.565-.76 28.748-3.296 52.702-7.09c23.962-3.792 40.12-6.384 52.318-9.545c11.805-3.064 17.247-6.049 20.76-9.121a45.7 45.7 0 0 0 11.95-16.459c1.84-4.288 3-10.385 2.264-22.563c-.76-12.562-3.297-28.749-7.09-52.705c-3.794-23.955-6.38-40.126-9.54-52.312c-3.066-11.81-6.059-17.25-9.124-20.763a45.7 45.7 0 0 0-16.455-11.954c-4.29-1.84-10.388-3-22.57-2.265c-12.565.76-28.74 3.297-52.701 7.09c-23.954 3.8-40.121 6.385-52.31 9.545c-11.813 3.065-17.247 6.057-20.76 9.122a45.7 45.7 0 0 0-11.958 16.458c-1.833 4.289-2.993 10.386-2.257 22.564c.76 12.57 3.29 28.748 7.091 52.704c3.794 23.956 6.379 40.127 9.54 52.313c3.065 11.81 6.05 17.25 9.124 20.763a45.7 45.7 0 0 0 16.455 11.954c4.29 1.84 10.38 3 22.57 2.264z"/>
  </svg>
);

SVG Logos

More like it

Icons that share its tags, in the same style.

All 2,063 icons
  • Headlessui icon from SVG Logos
  • Ant Design icon from SVG Logos
  • Grommet icon from SVG Logos
  • Tectonic icon from SVG Logos
  • Component icon from SVG Logos
  • Element icon from SVG Logos
  • Mantine icon from SVG Logos
  • Mantine Icon icon from SVG Logos
  • Mantl icon from SVG Logos
  • Invision Icon icon from SVG Logos
  • Material Ui icon from SVG Logos
  • Naiveui icon from SVG Logos
  • Prerender Icon icon from SVG Logos
  • Unito Icon icon from SVG Logos
  • Ampersand icon from SVG Logos
  • Componentkit icon from SVG Logos
  • Flat Ui 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
  • Imba Icon icon from SVG Logos
  • Inferno icon from SVG Logos
  • Invision icon from SVG Logos

Search 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

Headlessui Icon is tagged UI, interface, design and 3 more. Related tags follow; each opens its icons from every library.

All tags

Pricing

SVG Logos MCP, with Pro

Ask for Headlessui Icon 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.

See full pricing

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 Headlessui Icon icon means and where it's used, then how to install, style and license it.

Install Headlessui Icon from a prompt

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

Get Pro