Tailwind CSS Banner

This is a notification banner that can be used to update users

/r/n <span class=\"float-right block hover:font-semibold\"> \r\n <span class=\"ml-1\">→<\/span>\r\n<\/span>\r\n <\/a>\r\n<\/div>","author_type":"App\\User","author_id":17710,"collection_id":null,"fork_id":null,"votes":0,"score":"0.0","visits":2151,"popularity":33,"slug":"banner-4","approved":1,"created_at":"2024-03-19T00:00:00.000000Z","updated_at":"2024-09-19T02:26:18.000000Z","downloads":11,"code_views":97,"center":false,"notified":0,"premium":0,"tailwind_config":null,"type":"component","css":"https:\/\/cdn.tailwindcss.com","should_tweet":0,"media":[{"id":11807,"model_type":"App\\Component","model_id":6517,"collection_name":"preview","name":"temp32605","file_name":"temp32605.png","mime_type":"image\/png","disk":"public","size":10094,"manipulations":[],"custom_properties":[],"responsive_images":{"media_library_original":{"urls":["temp32605___media_library_original_1280_957.png"],"base64svg":"data:image\/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHg9IjAiCiB5PSIwIiB2aWV3Qm94PSIwIDAgMTI4MCA5NTciPgoJPGltYWdlIHdpZHRoPSIxMjgwIiBoZWlnaHQ9Ijk1NyIgeGxpbms6aHJlZj0iZGF0YTppbWFnZS9qcGVnO2Jhc2U2NCwvOWovNEFBUVNrWkpSZ0FCQVFFQVlBQmdBQUQvL2dBN1ExSkZRVlJQVWpvZ1oyUXRhbkJsWnlCMk1TNHdJQ2gxYzJsdVp5QkpTa2NnU2xCRlJ5QjJPREFwTENCeGRXRnNhWFI1SUQwZ09UQUsvOXNBUXdBREFnSURBZ0lEQXdNREJBTURCQVVJQlFVRUJBVUtCd2NHQ0F3S0RBd0xDZ3NMRFE0U0VBME9FUTRMQ3hBV0VCRVRGQlVWRlF3UEZ4Z1dGQmdTRkJVVS85c0FRd0VEQkFRRkJBVUpCUVVKRkEwTERSUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVLzhBQUVRZ0FHQUFnQXdFUkFBSVJBUU1SQWYvRUFCOEFBQUVGQVFFQkFRRUJBQUFBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUUFBSUJBd01DQkFNRkJRUUVBQUFCZlFFQ0F3QUVFUVVTSVRGQkJoTlJZUWNpY1JReWdaR2hDQ05Dc2NFVlV0SHdKRE5pY29JSkNoWVhHQmthSlNZbktDa3FORFUyTnpnNU9rTkVSVVpIU0VsS1UxUlZWbGRZV1ZwalpHVm1aMmhwYW5OMGRYWjNlSGw2ZzRTRmhvZUlpWXFTazVTVmxwZVltWnFpbzZTbHBxZW9xYXF5czdTMXRyZTR1YnJDdzhURnhzZkl5Y3JTMDlUVjF0ZlkyZHJoNHVQazVlYm42T25xOGZMejlQWDI5L2o1K3YvRUFCOEJBQU1CQVFFQkFRRUJBUUVBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUkFBSUJBZ1FFQXdRSEJRUUVBQUVDZHdBQkFnTVJCQVVoTVFZU1FWRUhZWEVUSWpLQkNCUkNrYUd4d1Frak0xTHdGV0p5MFFvV0pEVGhKZkVYR0JrYUppY29LU28xTmpjNE9UcERSRVZHUjBoSlNsTlVWVlpYV0ZsYVkyUmxabWRvYVdwemRIVjJkM2g1ZW9LRGhJV0doNGlKaXBLVGxKV1dsNWlabXFLanBLV21wNmlwcXJLenRMVzJ0N2k1dXNMRHhNWEd4OGpKeXRMVDFOWFcxOWpaMnVMajVPWG01K2pwNnZMejlQWDI5L2o1K3YvYUFBd0RBUUFDRVFNUkFEOEEvU0dTMFdVNU5hMXNKVHJ1ODBjOGFzb2JDQ3lRVnpmMlpRN0YvV0o5dyt4cDZDait6S0hZUHJFKzQ1TFpZemtWMDBjSlRvTzhFWnlxeW51VFYzR0FVQUZBQlFBVUFGQUJRQVVBZi8vWiI+Cgk8L2ltYWdlPgo8L3N2Zz4="}},"order_column":1,"created_at":"2024-03-19T22:29:03.000000Z","updated_at":"2024-03-19T22:29:04.000000Z","conversions_disk":"public","uuid":"5fec49e8-afe6-454f-867a-2d52d3b33fd5","generated_conversions":{"thumb":true,"ogimage":true},"original_url":"https:\/\/tailwindcomponents.com\/storage\/11807\/temp32605.png","preview_url":""}],"author":{"id":17710,"name":"denver-edwards","slug":"denver-edwards","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/22264411?v=4","header":null,"created_at":"2024-03-19T22:07:33.000000Z","updated_at":"2024-03-19T22:07:33.000000Z"},"tags":[{"id":16,"name":{"en":"Alerts"},"description":"The Alert component is used to attract the user's attention without interrupting the user's task. See below our collection of Alert examples that you can add directly to your Tailwind UI project.","meta_description":"Visit our collection of Alert examples that you can add directly to your Tailwind UI project to attract the user's attention.","slug":{"en":"alerts"},"type":null,"order_column":15,"created_at":"2022-08-31T14:13:44.000000Z","updated_at":"2022-08-31T14:13:44.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":6517,"tag_id":16}},{"id":82,"name":{"en":"Banner"},"description":"Utilize the banner component from Tailwind CSS, employing its utility classes to display marketing messages and Call-to-Action (CTA) buttons either at the top or bottom section of your website.","meta_description":"Utilize the banner component from Tailwind CSS, employing its utility classes to display marketing messages and Call-to-Action (CTA) buttons either at the top or bottom section of your website.","slug":{"en":"banner"},"type":null,"order_column":71,"created_at":"2023-11-14T16:17:58.000000Z","updated_at":"2023-11-14T16:17:58.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":6517,"tag_id":82}}],"fork":null,"favorites":[]}" :edit="false"> Full screen Preview

denver-edwards

4 components Profile On

Community Rate

Related components

See more components