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]
Tailwind CSS Floating Footer Menu
By salnetx
Floating footers using Tailwind CSS
Fork
Upvote
1
Share
React Components Library
Material Tailwind
Get Started
/r/n <svg fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z\"\/><\/svg>\r\n <\/a>\r\n\r\n <a class=\"px-3.5\" target=\"_blank\" href=https://www.creative-tim.com/"https:////www.producthunt.com//@salnetx/">/r/n <svg fill=\"currentColor\" width=\"28\" height=\"28\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\"><path d=\"M12.001 22C6.47813 22 2.00098 17.5228 2.00098 12C2.00098 6.47715 6.47813 2 12.001 2C17.5238 2 22.001 6.47715 22.001 12C22.001 17.5228 17.5238 22 12.001 22ZM13.3345 12H10.501V9H13.3345C14.1629 9 14.8345 9.67157 14.8345 10.5C14.8345 11.3284 14.1629 12 13.3345 12ZM13.3345 7H8.50098V17H10.501V14H13.3345C15.2675 14 16.8345 12.433 16.8345 10.5C16.8345 8.567 15.2675 7 13.3345 7Z\"><\/path><\/svg>\r\n <\/a>\r\n\r\n <a class=\"px-3.5 pt-0.5\" target=\"_blank\" href=https://www.creative-tim.com/"https:////twitter.com//salnetx/">/r/n <svg fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z\"\/><\/svg> \r\n <\/a>\r\n\r\n <a class=\"px-3.5 pt-0.5\" target=\"_blank\" href=https://www.creative-tim.com/"https:////x.com//salnetx/">/r/n <svg fill=\"currentColor\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M19.615 3.184c-3.604-.246-11.631-.245-15.23 0-3.897.266-4.356 2.62-4.385 8.816.029 6.185.484 8.549 4.385 8.816 3.6.245 11.626.246 15.23 0 3.897-.266 4.356-2.62 4.385-8.816-.029-6.185-.484-8.549-4.385-8.816zm-10.615 12.816v-8l8 3.993-8 4.007z\"\/><\/svg> \r\n <\/a>\r\n \r\n\r\n <\/div>\r\n\r\n \r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n\r\n\r\n <\/>","author_type":"App\\User","author_id":11726,"collection_id":null,"fork_id":null,"votes":0,"score":"0.0","visits":2406,"popularity":48,"slug":"floating-footer","approved":1,"created_at":"2024-01-12T00:00:00.000000Z","updated_at":"2024-09-19T02:58:08.000000Z","downloads":16,"code_views":146,"center":true,"notified":0,"premium":0,"tailwind_config":null,"type":"component","css":"https:\/\/cdn.tailwindcss.com","should_tweet":0,"media":[],"author":{"id":11726,"name":"salnetx","slug":"salnetx","bio":"web developer & designer. https:\/\/salnet.xyz","avatar":"\/storage\/avatars\/Z0TbtN0bSzW7B6r9j8LUen36NgJkX3gBusOeuMfZ.png","header":null,"created_at":"2023-04-01T17:17:02.000000Z","updated_at":"2024-03-23T10:28:00.000000Z"},"tags":[{"id":27,"name":{"en":"Menu"},"description":"A menu is a UI component which displays a list of choices on temporary surfaces. See below our collection of Menu examples that you can add directly to your Tailwind UI project.","meta_description":"Visit our collection of Menu examples that you can add directly to your Tailwind UI project for displaying a list of choices on temporary surfaces.","slug":{"en":"menu"},"type":null,"order_column":26,"created_at":"2022-08-31T14:19:53.000000Z","updated_at":"2022-12-21T11:02:45.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":6009,"tag_id":27}},{"id":95,"name":{"en":"Floating Label"},"description":"Implement the floating label style on input field elements to emulate the Material UI design system by Google. Select from a variety of styles and sizes to suit your preferences.","meta_description":"Implement the floating label style on input field elements to emulate the Material UI design system by Google. Select from a variety of styles and sizes to suit your preferences.","slug":{"en":"floating-label"},"type":null,"order_column":84,"created_at":"2023-11-15T16:11:35.000000Z","updated_at":"2023-11-15T16:11:35.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":6009,"tag_id":95}}],"fork":null,"favorites":[{"id":16134,"name":"ctrljames","slug":"ctrljames","bio":null,"avatar":"\/storage\/avatars\/lMpJLAqN28ZJJGQCY5AQ3u26YWS9brlZi2jRTXAV.jpg","header":"\/storage\/headers\/M9haOK3UGgaF25rhrulcTn76y9C6sOJuYQKq0MH6.jpg","created_at":"2024-01-01T06:41:07.000000Z","updated_at":"2024-01-22T15:16:15.000000Z","pivot":{"component_id":6009,"user_id":16134}}]}" :edit="false">
Full screen Preview
Download
salnetx
17 components
Profile On
Community Rate
Related components
Tailwind CSS input field
hashem
3.3
Navbar Section Hero and Menu
banny
3.0
Tailwind CSS Nested Menu
Material Tailwind
3.3
Tailwind CSS Drawer Sidenav
Salar Houshvand
3.3
Dark Mobile Navbar
Ardiansyah Putra
3.3
Tailwind CSS User menu with searchbar
iñigo
3.3
See more components