TW Components
Components
All Components
awesome
69
Accordions
7
Alerts
33
Alpinejs
93
Avatars
20
Badges
9
Banner
13
Blockquote
3
Bottom Navigation
5
Breadcrumb
9
Button Group
9
Buttons
429
Calendar
12
Cards
807
Carousel
5
Charts
13
Chat
11
Checkbox
14
Chip
8
Collapse
3
Cursor
0
Dashboard
35
Datepicker
3
Device Mockups
2
Drawer
2
Dropdowns
39
Faq
8
Features
23
File Upload
6
Floating Label
9
awesome
69
Footers
17
Forms
407
Gallery
6
Grid
17
Headers
36
Headings
1
Hr
0
Icons
100
Images
17
Indicators
2
Inputs
163
Jumbotron
9
Kbd
1
Kit
3
Layout
88
Links
3
List
49
Logins
127
Masonry
5
Mega Menu
2
Menu
23
Modals
58
Music Player
6
Navbars
29
Navigations
296
Number Input
7
Pages
695
Pagination
13
Paragraphs
4
awesome
69
Popover
10
Pricing
25
Progress
8
Radio Button
7
Range Slider
7
Rating
8
Scrollbar
9
Search bar
7
Selects
14
Shadows
1
Sidebar
38
Skeleton
4
Slider
15
Speed dial
0
Spinner
7
Stepper
2
Switch
8
Tables
74
Tabs
23
Testimonials
8
Text
8
Textarea
3
Timeline
16
Toast
4
Toggle
11
Tooltip
9
Typography
11
Video
6
Widget
752
Components
Resources
Cheatsheet
Gradient Generator
Blog
UI / UX Book
Free Blocks
PRO Blocks
React Components
Admin & Dashboards
Templates & Kits
Ecosystem
Material Tailwind
React Tailwind
Angular Tailwind
Astro Tailwind
Custom Development
PRO Blocks
Discover
Submit
Login
Components
All Components
awesome
69
Accordions
7
Alerts
33
Alpinejs
93
Avatars
20
Badges
9
Banner
13
Blockquote
3
Bottom Navigation
5
Breadcrumb
9
Button Group
9
Buttons
429
Calendar
12
Cards
807
Carousel
5
Charts
13
Chat
11
Checkbox
14
Chip
8
Collapse
3
Cursor
0
Dashboard
35
Datepicker
3
Device Mockups
2
Drawer
2
Dropdowns
39
Faq
8
Features
23
File Upload
6
Floating Label
9
awesome
69
Footers
17
Forms
407
Gallery
6
Grid
17
Headers
36
Headings
1
Hr
0
Icons
100
Images
17
Indicators
2
Inputs
163
Jumbotron
9
Kbd
1
Kit
3
Layout
88
Links
3
List
49
Logins
127
Masonry
5
Mega Menu
2
Menu
23
Modals
58
Music Player
6
Navbars
29
Navigations
296
Number Input
7
Pages
695
Pagination
13
Paragraphs
4
awesome
69
Popover
10
Pricing
25
Progress
8
Radio Button
7
Range Slider
7
Rating
8
Scrollbar
9
Search bar
7
Selects
14
Shadows
1
Sidebar
38
Skeleton
4
Slider
15
Speed dial
0
Spinner
7
Stepper
2
Switch
8
Tables
74
Tabs
23
Testimonials
8
Text
8
Textarea
3
Timeline
16
Toast
4
Toggle
11
Tooltip
9
Typography
11
Video
6
Widget
752
Components
Resources
Cheatsheet
Gradient Generator
Blog
UI / UX Book
Free Blocks
PRO Blocks
React Components
Admin & Dashboards
Templates & Kits
Ecosystem
Material Tailwind
React Tailwind
Angular Tailwind
Astro Tailwind
Custom Development
PRO Blocks
Discover
Submit
Login
[email protected]
Gallery
By MrsRobbot
Gallery
Fork
Upvote
5
Share
Low Code
Soft UI Dashboard Tailwind Builder
Try for free
/r/n <div class=\"px-8 py-10 relative z-10 w-full border-4 border-gray-200 bg-white opacity-0 hover:opacity-100\">\r\n <h2 class=\"tracking-widest text-sm title-font font-medium text-indigo-500 mb-1\">THE SUBTITLE<\/h2>\r\n <h1 class=\"title-font text-lg font-medium text-gray-900 mb-3\">Shooting Stars<\/h1>\r\n <p class=\"leading-relaxed\">Photo booth fam kinfolk cold-pressed sriracha leggings jianbing microdosing tousled waistcoat.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:w-1\/3 sm:w-1\/2 p-4\">\r\n <div class=\"flex relative\">\r\n <img alt=\"gallery\" class=\"absolute inset-0 w-full h-full object-cover object-center\" src=https://www.creative-tim.com/"https:////dummyimage.com//601x361/">/r/n <div class=\"px-8 py-10 relative z-10 w-full border-4 border-gray-200 bg-white opacity-0 hover:opacity-100\">\r\n <h2 class=\"tracking-widest text-sm title-font font-medium text-indigo-500 mb-1\">THE SUBTITLE<\/h2>\r\n <h1 class=\"title-font text-lg font-medium text-gray-900 mb-3\">The Catalyzer<\/h1>\r\n <p class=\"leading-relaxed\">Photo booth fam kinfolk cold-pressed sriracha leggings jianbing microdosing tousled waistcoat.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:w-1\/3 sm:w-1\/2 p-4\">\r\n <div class=\"flex relative\">\r\n <img alt=\"gallery\" class=\"absolute inset-0 w-full h-full object-cover object-center\" src=https://www.creative-tim.com/"https:////dummyimage.com//603x363/">/r/n <div class=\"px-8 py-10 relative z-10 w-full border-4 border-gray-200 bg-white opacity-0 hover:opacity-100\">\r\n <h2 class=\"tracking-widest text-sm title-font font-medium text-indigo-500 mb-1\">THE SUBTITLE<\/h2>\r\n <h1 class=\"title-font text-lg font-medium text-gray-900 mb-3\">The 400 Blows<\/h1>\r\n <p class=\"leading-relaxed\">Photo booth fam kinfolk cold-pressed sriracha leggings jianbing microdosing tousled waistcoat.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:w-1\/3 sm:w-1\/2 p-4\">\r\n <div class=\"flex relative\">\r\n <img alt=\"gallery\" class=\"absolute inset-0 w-full h-full object-cover object-center\" src=https://www.creative-tim.com/"https:////dummyimage.com//602x362/">/r/n <div class=\"px-8 py-10 relative z-10 w-full border-4 border-gray-200 bg-white opacity-0 hover:opacity-100\">\r\n <h2 class=\"tracking-widest text-sm title-font font-medium text-indigo-500 mb-1\">THE SUBTITLE<\/h2>\r\n <h1 class=\"title-font text-lg font-medium text-gray-900 mb-3\">Neptune<\/h1>\r\n <p class=\"leading-relaxed\">Photo booth fam kinfolk cold-pressed sriracha leggings jianbing microdosing tousled waistcoat.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:w-1\/3 sm:w-1\/2 p-4\">\r\n <div class=\"flex relative\">\r\n <img alt=\"gallery\" class=\"absolute inset-0 w-full h-full object-cover object-center\" src=https://www.creative-tim.com/"https:////dummyimage.com//605x365/">/r/n <div class=\"px-8 py-10 relative z-10 w-full border-4 border-gray-200 bg-white opacity-0 hover:opacity-100\">\r\n <h2 class=\"tracking-widest text-sm title-font font-medium text-indigo-500 mb-1\">THE SUBTITLE<\/h2>\r\n <h1 class=\"title-font text-lg font-medium text-gray-900 mb-3\">Holden Caulfield<\/h1>\r\n <p class=\"leading-relaxed\">Photo booth fam kinfolk cold-pressed sriracha leggings jianbing microdosing tousled waistcoat.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"lg:w-1\/3 sm:w-1\/2 p-4\">\r\n <div class=\"flex relative\">\r\n <img alt=\"gallery\" class=\"absolute inset-0 w-full h-full object-cover object-center\" src=https://www.creative-tim.com/"https:////dummyimage.com//606x366/">/r/n <div class=\"px-8 py-10 relative z-10 w-full border-4 border-gray-200 bg-white opacity-0 hover:opacity-100\">\r\n <h2 class=\"tracking-widest text-sm title-font font-medium text-indigo-500 mb-1\">THE SUBTITLE<\/h2>\r\n <h1 class=\"title-font text-lg font-medium text-gray-900 mb-3\">Alper Kamu<\/h1>\r\n <p class=\"leading-relaxed\">Photo booth fam kinfolk cold-pressed sriracha leggings jianbing microdosing tousled waistcoat.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>","author_type":"App\\User","author_id":7933,"collection_id":null,"fork_id":null,"votes":1,"score":"5.0","visits":6141,"popularity":402,"slug":"gallery-4","approved":1,"created_at":"2022-05-23T00:00:00.000000Z","updated_at":"2024-08-29T02:44:56.000000Z","downloads":129,"code_views":1647,"center":false,"notified":0,"premium":0,"tailwind_config":null,"type":"component","css":"https:\/\/cdn.tailwindcss.com","should_tweet":1,"media":[{"id":6782,"model_type":"App\\Component","model_id":3472,"collection_name":"preview","name":"temp95926","file_name":"temp95926.png","mime_type":"image\/png","disk":"public","size":76324,"manipulations":[],"custom_properties":[],"responsive_images":{"media_library_original":{"urls":["temp95926___media_library_original_1280_957.png","temp95926___media_library_original_1070_799.png","temp95926___media_library_original_895_669.png","temp95926___media_library_original_749_559.png","temp95926___media_library_original_627_468.png","temp95926___media_library_original_524_391.png"],"base64svg":"data:image\/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHg9IjAiCiB5PSIwIiB2aWV3Qm94PSIwIDAgMTI4MCA5NTciPgoJPGltYWdlIHdpZHRoPSIxMjgwIiBoZWlnaHQ9Ijk1NyIgeGxpbms6aHJlZj0iZGF0YTppbWFnZS9qcGVnO2Jhc2U2NCwvOWovNEFBUVNrWkpSZ0FCQVFFQVlBQmdBQUQvL2dBN1ExSkZRVlJQVWpvZ1oyUXRhbkJsWnlCMk1TNHdJQ2gxYzJsdVp5QkpTa2NnU2xCRlJ5QjJPREFwTENCeGRXRnNhWFI1SUQwZ09UQUsvOXNBUXdBREFnSURBZ0lEQXdNREJBTURCQVVJQlFVRUJBVUtCd2NHQ0F3S0RBd0xDZ3NMRFE0U0VBME9FUTRMQ3hBV0VCRVRGQlVWRlF3UEZ4Z1dGQmdTRkJVVS85c0FRd0VEQkFRRkJBVUpCUVVKRkEwTERSUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVLzhBQUVRZ0FGd0FmQXdFUkFBSVJBUU1SQWYvRUFCOEFBQUVGQVFFQkFRRUJBQUFBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUUFBSUJBd01DQkFNRkJRUUVBQUFCZlFFQ0F3QUVFUVVTSVRGQkJoTlJZUWNpY1JReWdaR2hDQ05Dc2NFVlV0SHdKRE5pY29JSkNoWVhHQmthSlNZbktDa3FORFUyTnpnNU9rTkVSVVpIU0VsS1UxUlZWbGRZV1ZwalpHVm1aMmhwYW5OMGRYWjNlSGw2ZzRTRmhvZUlpWXFTazVTVmxwZVltWnFpbzZTbHBxZW9xYXF5czdTMXRyZTR1YnJDdzhURnhzZkl5Y3JTMDlUVjF0ZlkyZHJoNHVQazVlYm42T25xOGZMejlQWDI5L2o1K3YvRUFCOEJBQU1CQVFFQkFRRUJBUUVBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUkFBSUJBZ1FFQXdRSEJRUUVBQUVDZHdBQkFnTVJCQVVoTVFZU1FWRUhZWEVUSWpLQkNCUkNrYUd4d1Frak0xTHdGV0p5MFFvV0pEVGhKZkVYR0JrYUppY29LU28xTmpjNE9UcERSRVZHUjBoSlNsTlVWVlpYV0ZsYVkyUmxabWRvYVdwemRIVjJkM2g1ZW9LRGhJV0doNGlKaXBLVGxKV1dsNWlabXFLanBLV21wNmlwcXJLenRMVzJ0N2k1dXNMRHhNWEd4OGpKeXRMVDFOWFcxOWpaMnVMajVPWG01K2pwNnZMejlQWDI5L2o1K3YvYUFBd0RBUUFDRVFNUkFEOEEvUStiWHJZWkFrR2ZyWG9jeU9MbFpTbTFSQ2MrY0FENzBjNkRsWXNPcW9uekdVRWZXam1RdVZsNkhYYlp2K1dnSit0SE1oOHJQUExvUi9hT1hJTmNiM09wRWwxNWZsSmx5QlF3Q1B5L3NoK2M0bzZBSlllV0hPSFkwSURzNVBDTnJJKzRqbXVuMmFPZm5Zc25oTzJrVUFqZ1VlelFjN0ZIaE8yV01wamluN05CenNTSHduYlFuS2lsN05CenMvL1oiPgoJPC9pbWFnZT4KPC9zdmc+"}},"order_column":6645,"created_at":"2022-05-23T15:28:31.000000Z","updated_at":"2022-05-23T15:28:32.000000Z","conversions_disk":"public","uuid":"034b4304-a56b-4c1b-9ea9-531344fe3047","generated_conversions":{"thumb":true,"ogimage":true},"original_url":"https:\/\/tailwindcomponents.com\/storage\/6782\/temp95926.png","preview_url":""}],"author":{"id":7933,"name":"MrsRobbot","slug":"mrsrobbot","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/48609418?v=4","header":null,"created_at":"2022-05-23T14:34:31.000000Z","updated_at":"2022-05-23T14:34:31.000000Z"},"tags":[{"id":4,"name":{"en":"Cards"},"description":"Check out our examples of beautifully designed cards that will help you display your content easily. Use our snippets to preview the code and spend less time re-inventing the wheel.","meta_description":"Check out our examples of beautifully designed cards that will help you display your content easily.","slug":{"en":"cards"},"type":null,"order_column":3,"created_at":"2019-07-04T08:20:17.000000Z","updated_at":"2022-08-01T16:06:24.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":3472,"tag_id":4}},{"id":7,"name":{"en":"Pages"},"description":"Looking to get the work done faster? Choose from our collection of 500+ fully coded page examples that are built using the popular CSS framework - Tailwind CSS. Get started or get inspired!","meta_description":"Choose from our collection of 500+ fully coded page examples that are built using the popular CSS framework - Tailwind CSS","slug":{"en":"pages"},"type":null,"order_column":10,"created_at":"2019-07-04T08:20:17.000000Z","updated_at":"2022-08-01T16:13:03.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":3472,"tag_id":7}},{"id":86,"name":{"en":"Gallery"},"description":"The gallery component, utilizing Tailwind CSS's utility-first classes, showcases multiple images in a masonry grid layout. It offers diverse layouts, styles, sizes, and colors, providing users with an engaging collection of pictures.","meta_description":"The gallery component, utilizing Tailwind CSS's utility-first classes, showcases multiple images in a masonry grid layout. It offers diverse layouts, styles, sizes, and colors, providing users with an engaging collection of pictures.","slug":{"en":"gallery"},"type":null,"order_column":75,"created_at":"2023-11-14T16:44:00.000000Z","updated_at":"2023-11-14T16:44:00.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":3472,"tag_id":86}},{"id":87,"name":{"en":"Masonry"},"description":"Utilize the image gallery component employing a masonry grid layout, utilizing Tailwind CSS flex and grid classes. Display multiple pictures in various styles to enhance visual appeal and presentation.","meta_description":"Utilize the image gallery component employing a masonry grid layout, utilizing Tailwind CSS flex and grid classes. Display multiple pictures in various styles to enhance visual appeal and presentation.","slug":{"en":"masonry"},"type":null,"order_column":76,"created_at":"2023-11-14T16:47:15.000000Z","updated_at":"2023-11-14T16:47:15.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":3472,"tag_id":87}}],"fork":null,"favorites":[{"id":7933,"name":"MrsRobbot","slug":"mrsrobbot","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/48609418?v=4","header":null,"created_at":"2022-05-23T14:34:31.000000Z","updated_at":"2022-05-23T14:34:31.000000Z","pivot":{"component_id":3472,"user_id":7933}},{"id":3241,"name":"moneya","slug":"moneya","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/7353773?v=4","header":null,"created_at":"2021-04-28T15:37:06.000000Z","updated_at":"2021-04-28T15:37:06.000000Z","pivot":{"component_id":3472,"user_id":3241}},{"id":8280,"name":"NdekoCode","slug":"ndekocode","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/85836702?v=4","header":"\/storage\/headers\/3FqzEebO3eZi51EIVGBz9z4Z9OfkfxfX63Dtgga5.png","created_at":"2022-06-28T15:31:22.000000Z","updated_at":"2023-09-08T17:49:11.000000Z","pivot":{"component_id":3472,"user_id":8280}},{"id":16490,"name":"Avador Beamer","slug":"avador-beamer","bio":null,"avatar":"https:\/\/www.gravatar.com\/avatar\/32e5ecf413391e2e3a0022000fd92309","header":null,"created_at":"2024-01-22T08:34:11.000000Z","updated_at":"2024-01-22T08:34:11.000000Z","pivot":{"component_id":3472,"user_id":16490}},{"id":16194,"name":"SynFunjioka","slug":"synfunjioka","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/47235988?v=4","header":null,"created_at":"2024-01-04T21:11:00.000000Z","updated_at":"2024-01-04T21:11:00.000000Z","pivot":{"component_id":3472,"user_id":16194}}]}" :edit="false">
Full screen Preview
Download
MrsRobbot
10 components
Profile On
Community Rate
Related components
Tailwind CSS E-commerce Cart
Nbdleto
3.0
Responsive Two Columns Sidebar Layout
Kamona-WD
2.0
Product Card
dotsimplify
2.2
Visual image with heading
Ngonidzashe Sendama
3.0
Mac Terminal
laraben
1.0
Landing Page with Tailwind CSS 2
mithicher
1.0
See more components