Home
ABDO-SY
Order Delivered List

Order Delivered List

This tailwind example is contributed by ABDO-SY, on 21-Apr-2025. Component is made with Tailwind CSS v3.

List

804

<div class="rounded-xl max-w-[350px] bg-[#E15C44] p-6">
  <div class="mb-7 flex justify-between items-center">
    <h2 class=" text-white text-sm font-medium font-['Poppins'] leading-tight">Order Delivered</h2>
    <span class=" text-white text-xl font-semibold font-['Poppins'] leading-7">932</span>
  </div>
  <div class="flex justify-between border-b border-white py-2">
    <span class=" text-white text-xs font-normal font-['Poppins'] leading-none">Indonesia Food (27%)</span><span class=" text-white text-xs font-semibold font-['Poppins'] leading-tight">763</span>
  </div>
  <div class="flex justify-between border-b border-white py-2">
    <span class=" text-white text-xs font-normal font-['Poppins'] leading-none">Indonesia Food (27%)</span><span class=" text-white text-xs font-semibold font-['Poppins'] leading-tight">763</span>
  </div>
  <div class="flex justify-between border-b border-white py-2">
    <span class=" text-white text-xs font-normal font-['Poppins'] leading-none">Indonesia Food (27%)</span><span class=" text-white text-xs font-semibold font-['Poppins'] leading-tight">763</span>
  </div>
  <div class="flex justify-between border-b border-white py-2">
    <span class=" text-white text-xs font-normal font-['Poppins'] leading-none">Indonesia Food (27%)</span><span class=" text-white text-xs font-semibold font-['Poppins'] leading-tight">763</span>
  </div>
  <div class="flex justify-between border-b border-white py-2">
    <span class=" text-white text-xs font-normal font-['Poppins'] leading-none">Indonesia Food (27%)</span><span class=" text-white text-xs font-semibold font-['Poppins'] leading-tight">763</span>
  </div>
  <div class="flex justify-between border-b border-white py-2">
    <span class=" text-white text-xs font-normal font-['Poppins'] leading-none">Indonesia Food (27%)</span><span class=" text-white text-xs font-semibold font-['Poppins'] leading-tight">763</span>
  </div>
</div>

Related Examples

Logo cloud

Author:
Alok

2 years ago

10.6k
Timeline
timeline with journey

Author:
Abhiraj

1 year ago

1.2k
Game Character Cards
Simple game character cards selection

Author:
Diavox Jerome Soriano

1 year ago

1.5k
Table
Table with image and status with pagination buttons

Author:
Abhiraj

1 year ago

2.5k
Features list

Author:
Leon Bachmann

3 years ago

11.1k
Services list

Author:
ariaw

4 months ago

171
Reusable Skill Showcase Section With Pure Tailwind CSS
A fully responsive and modular "Skills & Tools" section, perfect for any developer portfolio. Built with static HTML and Tailwind CSS, this component can be easily integrated into any project and made dynamic using any frontend framework (Vue, React, Svelte, Angular) or vanilla JavaScript. Customize it to highlight your unique tech stack and create engaging portfolio pages.

Author:
Abdul Baset Bappy

11 months ago

1.9k
Item List with title
created by using fieldset and legend tags

Author:
Prashant

3 years ago

11.4k
todo list with Tailwind CSS and Alpinejs

Author:
Michael Andreuzza

1 year ago

2k
Hierarchy list

Author:
Anonymous

2 years ago

10.8k
Item List

Author:
Amit Pachange

3 years ago

9.9k
Todo list in tailwlind

Author:
Kofi Osei

3 years ago

17.1k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components