Home
TailwindFlex
Button Group

Button Group

This tailwind example is contributed by TailwindFlex, on 25-Sep-2022. Component is made with Tailwind CSS v3.

<nav class="flex gap-3 flex-wrap justify-center text-lg">
    <a class="text-center my-2 inline-block w-40 rounded-full bg-blue-800 bg-opacity-10 px-4 py-2 font-semibold text-blue-800 duration-200 hover:bg-opacity-95 hover:text-white hover:no-underline sm:w-48"
        href="/react">React</a>
    <a class="text-center my-2 inline-block w-40 rounded-full bg-blue-800 bg-opacity-10 px-4 py-2 font-semibold text-blue-800 duration-200 hover:bg-opacity-95 hover:text-white hover:no-underline sm:w-48"
        href="/solid">Solid</a>
    <a class="text-center my-2 inline-block w-40 rounded-full bg-blue-800 bg-opacity-10 px-4 py-2 font-semibold text-blue-800 duration-200 hover:bg-opacity-95 hover:text-white hover:no-underline sm:w-48"
        href="/svelte">Svelte</a>
    <a class="text-center my-2 inline-block w-40 rounded-full bg-blue-800 bg-opacity-10 px-4 py-2 font-semibold text-blue-800 duration-200 hover:bg-opacity-95 hover:text-white hover:no-underline sm:w-48"
        href="/vue">Vue</a>
    <a class="text-center my-2 inline-block w-40 rounded-full bg-blue-800 bg-opacity-10 px-4 py-2 font-semibold text-blue-800 duration-200 hover:bg-opacity-95 hover:text-white hover:no-underline sm:w-48"
        href="/angular">Angular</a>
</nav>

Related Examples

Tag Cloud
Tag cloud with sub-sections

Author:
Prajwal Hallale

2 years ago

12.9k
Radio Button Group for Search Filters
set of radio buttons grouped for selecting different search filters

Author:
Prajwal Hallale

1 year ago

5.5k
Tag/Button Cloud
Responsive tag cloud. Made with Flex-Box

Author:
TailwindFlex

3 years ago

12k
Button cloud for categories,tags etc

Author:
Kris Showen

2 years ago

13k
Minimal tag cloud design with heading text

Author:
Rafferty Kim

2 years ago

10.2k
Tag links component

Author:
Arya

2 years ago

9k
macOS Style Webpage – macOS Design in the Browser
A simple webpage inspired by the macOS interface. It recreates the clean design, dock, and desktop look of macOS using only HTML, tailwind CSS, and JavaScript. This project focuses on front-end styling and layout to bring the visual feel of macOS to the web — not a full simulation, just the look and vibe.

Author:
Hamza Atig

1 week ago

178
Play, Pause and Stop buttons

Author:
Lukas Müller

2 years ago

11.2k
Buttons set
buttons sets of, primary, outlined, text and link

Author:
Akram Khan

1 year ago

1.6k
Multi-Select Dropdown Filter with search
Interactive filtering component built with Alpine.js and Tailwind CSS, featuring searchable multi-select dropdowns with dynamic URL parameters. The system includes responsive design, real-time search functionality, and visual feedback through selected item tags that can be easily removed.

Author:
Anonymous

7 months ago

1k
Thumbs up and thumbs down buttons
Upvote downvote buttons

Author:
Prajwal Hallale

2 years ago

11.8k
buttons group
some attractive button group on different varients primary, outlined and link button

Author:
Akram Khan

1 year ago

1.8k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components