TW Components
Components
All Components
awesome
69
Accordions
7
Alerts
34
Alpinejs
93
Avatars
20
Badges
9
Banner
13
Blockquote
3
Bottom Navigation
5
Breadcrumb
9
Button Group
9
Buttons
437
Calendar
12
Cards
829
Carousel
5
Charts
13
Chat
11
Checkbox
15
Chip
8
Collapse
3
Cursor
0
Dashboard
36
Datepicker
3
Device Mockups
2
Drawer
2
Dropdowns
41
Faq
8
Features
23
File Upload
6
Floating Label
9
awesome
69
Footers
18
Forms
410
Gallery
6
Grid
17
Headers
36
Headings
1
Hr
0
Icons
102
Images
17
Indicators
2
Inputs
180
Jumbotron
9
Kbd
1
Kit
3
Layout
88
Links
3
List
50
Logins
129
Masonry
5
Mega Menu
2
Menu
23
Modals
58
Music Player
6
Navbars
30
Navigations
296
Number Input
20
Pages
698
Pagination
13
Paragraphs
4
awesome
69
Popover
10
Pricing
26
Progress
8
Radio Button
9
Range Slider
7
Rating
9
Scrollbar
9
Search bar
8
Selects
16
Shadows
1
Sidebar
42
Skeleton
5
Slider
15
Speed dial
0
Spinner
7
Stepper
2
Switch
9
Tables
74
Tabs
24
Testimonials
9
Text
8
Textarea
3
Timeline
16
Toast
4
Toggle
12
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
34
Alpinejs
93
Avatars
20
Badges
9
Banner
13
Blockquote
3
Bottom Navigation
5
Breadcrumb
9
Button Group
9
Buttons
437
Calendar
12
Cards
829
Carousel
5
Charts
13
Chat
11
Checkbox
15
Chip
8
Collapse
3
Cursor
0
Dashboard
36
Datepicker
3
Device Mockups
2
Drawer
2
Dropdowns
41
Faq
8
Features
23
File Upload
6
Floating Label
9
awesome
69
Footers
18
Forms
410
Gallery
6
Grid
17
Headers
36
Headings
1
Hr
0
Icons
102
Images
17
Indicators
2
Inputs
180
Jumbotron
9
Kbd
1
Kit
3
Layout
88
Links
3
List
50
Logins
129
Masonry
5
Mega Menu
2
Menu
23
Modals
58
Music Player
6
Navbars
30
Navigations
296
Number Input
20
Pages
698
Pagination
13
Paragraphs
4
awesome
69
Popover
10
Pricing
26
Progress
8
Radio Button
9
Range Slider
7
Rating
9
Scrollbar
9
Search bar
8
Selects
16
Shadows
1
Sidebar
42
Skeleton
5
Slider
15
Speed dial
0
Spinner
7
Stepper
2
Switch
9
Tables
74
Tabs
24
Testimonials
9
Text
8
Textarea
3
Timeline
16
Toast
4
Toggle
12
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":6279,"popularity":402,"slug":"gallery-4","approved":1,"created_at":"2022-05-23T00:00:00.000000Z","updated_at":"2024-09-19T02:32:59.000000Z","downloads":129,"code_views":1674,"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
Minimal Login Form
atikur-rabbi
2.0
Spotify - Playlist Card
Dzaky Widya Putra
3.0
Tailwind CSS Masonry Gallery
jaideepghosh
3.3
Coming Soon Page
surjithctly
3.0
Cards with Tags
Icesofty
1.2
Tailwind CSS Forget password
Anja
3.3
See more components