Home
Sedat Kumcu
Simple Breadcrumb Example

Simple Breadcrumb Example

Simple Breadcrumb Example with Light and black background options.

This tailwind example is contributed by Sedat Kumcu, on 07-Nov-2024. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode.

Breadcrumb

Author Sedat Kumcu

Fork Fullscreen

<div class="flex items-center text-gray-700 text-sm font-medium space-x-2">
    <a href="#" class="text-indigo-600 hover:text-indigo-800 transition-colors">Home</a>
    <span class="text-gray-400">/</span>
    
    <a href="#" class="text-indigo-600 hover:text-indigo-800 transition-colors">Category</a>
    <span class="text-gray-400">/</span>
    
    <a href="#" class="text-indigo-600 hover:text-indigo-800 transition-colors">Subcategory</a>
    <span class="text-gray-400">/</span>
    
    <span class="text-gray-500 font-semibold">Current Page</span>
</div>

<nav class="flex items-center text-gray-200 text-sm font-medium space-x-2 bg-black p-4 rounded">
    <a href="#" class="text-gray-300 hover:text-white transition-colors">Home</a>
    <span class="text-gray-500">/</span>
    
    <a href="#" class="text-gray-300 hover:text-white transition-colors">Category</a>
    <span class="text-gray-500">/</span>
    
    <a href="#" class="text-gray-300 hover:text-white transition-colors">Subcategory</a>
    <span class="text-gray-500">/</span>
    
    <span class="text-gray-100 font-semibold">Current Page</span>
</nav>

Related Examples

Acode Master
Acode Master is a skilled and passionate software developer known for mastering coding and creating innovative tech solutions. Specializing in modern web technologies like React.js, Node.js, PHP, and databases such as MySQL and PostgreSQL, Acode Master builds practical, efficient, and scalable applications. Beyond coding, Acode Master is dedicated to continuous learning, sharing knowledge, and empowering others through technology-driven projects and education.

Author:
Code Master(Mfuranziza Dusabe Hamza)

5 months ago

1.1k
Gradient Breadcrumb
Breadcrumb. Gradient background. Gradient text on hover. Based on gopi/breadcrumb-2.

Author:
Nick Girga

6 months ago

804
Acode master
Acode master(=>good work for Acode master)

Author:
Code Master(Mfuranziza Dusabe Hamza)

5 months ago

756
Why Everyone Around the World Loves Us
"Our platform is built to serve everyone, everywhere — with speed, security, and a human touch." "From cities to remote villages, our features connect the world through technology that truly cares." "Designed with the whole world in mind — fast, secure, and made for real people." "No matter who you are or where you're from, our tools are built to empower and inspire you." "We believe great technology should be accessible, safe, and helpful to all — and that's exactly what we offer."

Author:
Nicole Shalom

5 months ago

898
Breadcrumb

Author:
Laurits

2 years ago

11.4k
Basic breadcrumb

Author:
Ava Brown

2 years ago

9.4k
Breadcrumb

Author:
Ron Hicks

3 years ago

10.4k
Acode master
Welcome to Hamza's official portfolio — a creative developer blending modern design with powerful code. Explore animations, projects, and innovations crafted with HTML, Tailwind CSS, and passion.

Author:
Code Master(Mfuranziza Dusabe Hamza)

5 months ago

525
Acode Master - FB & WhatsApp UI Combo
Description (meta description) ni tag ikoreshwa mu mutwe (head) wa HTML igaragaza mu ncamake icyo urubuga cyangwa urupapuro rwawe ruvuga. Iyi description ikoreshwa cyane na search engines (nka Google) mu kwerekana summary y’urubuga mu bisubizo by’ubushakashatsi.

Author:
Code Master(Mfuranziza Dusabe Hamza)

5 months ago

503
Breadcrumbs
Basic navigation trail with SVG icon

Author:
Anja Müller

2 years ago

8.1k
Mfuranziza Hamza
Mfuranziza Hamza full development

Author:
Code Master(Mfuranziza Dusabe Hamza)

2 months ago

461
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

167

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components