Striped Table

Simple striped table made using Tailwind CSS

622322662/r/n <td class=\"text-left py-3 px-4\"><a class=\"hover:text-blue-500\" href=https://www.creative-tim.com/twcomponents/component/\"mailto:jonsmith@mail.com\">jonsmith@mail.com/r/n <\/tr>\r\n <tr class=\"bg-gray-100\">\r\n <td class=\"w-1\/3 text-left py-3 px-4\">Emma<\/td>\r\n <td class=\"w-1\/3 text-left py-3 px-4\">Johnson<\/td>\r\n <td class=\"text-left py-3 px-4\"><a class=\"hover:text-blue-500\" href=https://www.creative-tim.com/"tel:622322662/">622322662/r/n <td class=\"text-left py-3 px-4\"><a class=\"hover:text-blue-500\" href=https://www.creative-tim.com/twcomponents/component/\"mailto:jonsmith@mail.com\">jonsmith@mail.com/r/n <\/tr>\r\n <tr>\r\n <td class=\"w-1\/3 text-left py-3 px-4\">Oliver<\/td>\r\n <td class=\"w-1\/3 text-left py-3 px-4\">Williams<\/td>\r\n <td class=\"text-left py-3 px-4\"><a class=\"hover:text-blue-500\" href=https://www.creative-tim.com/"tel:622322662/">622322662/r/n <td class=\"text-left py-3 px-4\"><a class=\"hover:text-blue-500\" href=https://www.creative-tim.com/twcomponents/component/\"mailto:jonsmith@mail.com\">jonsmith@mail.com/r/n <\/tr>\r\n <tr class=\"bg-gray-100\">\r\n <td class=\"w-1\/3 text-left py-3 px-4\">Isabella<\/td>\r\n <td class=\"w-1\/3 text-left py-3 px-4\">Brown<\/td>\r\n <td class=\"text-left py-3 px-4\"><a class=\"hover:text-blue-500\" href=https://www.creative-tim.com/"tel:622322662/">622322662/r/n <td class=\"text-left py-3 px-4\"><a class=\"hover:text-blue-500\" href=https://www.creative-tim.com/twcomponents/component/\"mailto:jonsmith@mail.com\">jonsmith@mail.com/r/n <\/tr>\r\n <\/tbody>\r\n <\/table>\r\n <\/div>\r\n<\/div>","author_type":"App\\User","author_id":4,"collection_id":null,"fork_id":null,"votes":20,"score":"3.1","visits":44247,"popularity":1339,"slug":"striped-table","approved":1,"created_at":"2020-03-23T08:25:48.000000Z","updated_at":"2024-08-29T08:58:34.000000Z","downloads":432,"code_views":18913,"center":false,"notified":1,"premium":0,"tailwind_config":null,"type":"component","css":"https:\/\/unpkg.com\/tailwindcss@1.9.6\/dist\/tailwind.min.css","should_tweet":0,"media":[{"id":960,"model_type":"App\\Component","model_id":286,"collection_name":"preview","name":"temp33133","file_name":"temp33133.png","mime_type":"image\/png","disk":"public","size":70143,"manipulations":[],"custom_properties":{"generated_conversions":{"thumb":true,"ogimage":true}},"responsive_images":{"medialibrary_original":{"urls":["temp33133___medialibrary_original_1280_957.png","temp33133___medialibrary_original_1070_799.png","temp33133___medialibrary_original_896_669.png","temp33133___medialibrary_original_749_559.png","temp33133___medialibrary_original_627_468.png","temp33133___medialibrary_original_524_391.png"],"base64svg":"data:image\/svg+xml;base64,PCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHg9IjAiCiB5PSIwIiB2aWV3Qm94PSIwIDAgMTI4MCA5NTciPgoJPGltYWdlIHdpZHRoPSIxMjgwIiBoZWlnaHQ9Ijk1NyIgeGxpbms6aHJlZj0iZGF0YTppbWFnZS9qcGVnO2Jhc2U2NCwvOWovNEFBUVNrWkpSZ0FCQVFFQVlBQmdBQUQvL2dBN1ExSkZRVlJQVWpvZ1oyUXRhbkJsWnlCMk1TNHdJQ2gxYzJsdVp5QkpTa2NnU2xCRlJ5QjJPREFwTENCeGRXRnNhWFI1SUQwZ09UQUsvOXNBUXdBREFnSURBZ0lEQXdNREJBTURCQVVJQlFVRUJBVUtCd2NHQ0F3S0RBd0xDZ3NMRFE0U0VBME9FUTRMQ3hBV0VCRVRGQlVWRlF3UEZ4Z1dGQmdTRkJVVS85c0FRd0VEQkFRRkJBVUpCUVVKRkEwTERSUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVRkJRVUZCUVVGQlFVLzhBQUVRZ0FGd0FmQXdFUkFBSVJBUU1SQWYvRUFCOEFBQUVGQVFFQkFRRUJBQUFBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUUFBSUJBd01DQkFNRkJRUUVBQUFCZlFFQ0F3QUVFUVVTSVRGQkJoTlJZUWNpY1JReWdaR2hDQ05Dc2NFVlV0SHdKRE5pY29JSkNoWVhHQmthSlNZbktDa3FORFUyTnpnNU9rTkVSVVpIU0VsS1UxUlZWbGRZV1ZwalpHVm1aMmhwYW5OMGRYWjNlSGw2ZzRTRmhvZUlpWXFTazVTVmxwZVltWnFpbzZTbHBxZW9xYXF5czdTMXRyZTR1YnJDdzhURnhzZkl5Y3JTMDlUVjF0ZlkyZHJoNHVQazVlYm42T25xOGZMejlQWDI5L2o1K3YvRUFCOEJBQU1CQVFFQkFRRUJBUUVBQUFBQUFBQUJBZ01FQlFZSENBa0tDLy9FQUxVUkFBSUJBZ1FFQXdRSEJRUUVBQUVDZHdBQkFnTVJCQVVoTVFZU1FWRUhZWEVUSWpLQkNCUkNrYUd4d1Frak0xTHdGV0p5MFFvV0pEVGhKZkVYR0JrYUppY29LU28xTmpjNE9UcERSRVZHUjBoSlNsTlVWVlpYV0ZsYVkyUmxabWRvYVdwemRIVjJkM2g1ZW9LRGhJV0doNGlKaXBLVGxKV1dsNWlabXFLanBLV21wNmlwcXJLenRMVzJ0N2k1dXNMRHhNWEd4OGpKeXRMVDFOWFcxOWpaMnVMajVPWG01K2pwNnZMejlQWDI5L2o1K3YvYUFBd0RBUUFDRVFNUkFEOEErMlBpQjhhckx3SmVDQ2VGNUNmN29yMHp6emtHL2FzMHBTQWJXWG4vQUdUVHNPekl6KzFqcElCUDJXWGovWm9zRm1kNzhPZmk1YWZFRkpHdG9uajJmM2hpa0k2alUvQWVqZUlweEpmV3Njemp1d3JubTJqZUJuU2ZCM3dzeU5uVG9lUDlrVmx6TTBzaUIvZzM0VzhzZjhTNkgvdm1qbVlXUnNhSDRMMHJ3MmhGaGJKQ0c2N1JpdDROdmN4bWtiWUJCNE5hTkprWEZJWWpGTGxRY3pHbU1rWW81VUhNd0F4VHRZVGR6Ly9aIj4KCTwvaW1hZ2U+Cjwvc3ZnPg=="}},"order_column":946,"created_at":"2020-03-23T08:26:02.000000Z","updated_at":"2020-09-25T21:39:18.000000Z","conversions_disk":"public","uuid":"04c0e380-8c78-419c-b274-8785c6f788c0","generated_conversions":null,"original_url":"https:\/\/tailwindcomponents.com\/storage\/960\/temp33133.png","preview_url":""}],"author":{"id":4,"name":"TonyCampa","slug":"tonycampa","bio":null,"avatar":"https:\/\/www.gravatar.com\/avatar\/4191d6ae064c8ae14a905d741dee1930","header":null,"created_at":"2019-07-08T16:11:26.000000Z","updated_at":"2019-07-08T16:11:26.000000Z"},"tags":[{"id":6,"name":{"en":"Tables"},"description":"Choose from our flexible table examples to organize and display the data efficiently in your Tailwind project. Use our snippets to preview and copy\/paste the code.","meta_description":"Choose from our flexible table examples to organize and display the data efficiently in your Tailwind project.","slug":{"en":"tables"},"type":null,"order_column":13,"created_at":"2019-07-04T08:20:17.000000Z","updated_at":"2022-08-01T16:15:59.000000Z","pivot":{"taggable_type":"App\\Component","taggable_id":286,"tag_id":6}}],"fork":null,"favorites":[{"id":5179,"name":"emilysheepy","slug":"emilysheepy","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/5437949?v=4","header":null,"created_at":"2021-09-25T12:45:39.000000Z","updated_at":"2021-09-25T12:45:39.000000Z","pivot":{"component_id":286,"user_id":5179}},{"id":5568,"name":"Iulian Cazan","slug":"iulian-cazan","bio":null,"avatar":"https:\/\/www.gravatar.com\/avatar\/96b3b66ca86ae796fbcaa94c28c66aad","header":null,"created_at":"2021-10-25T08:59:48.000000Z","updated_at":"2021-10-25T08:59:48.000000Z","pivot":{"component_id":286,"user_id":5568}},{"id":6440,"name":"NogyJ0D","slug":"nogyj0d","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/81924427?v=4","header":null,"created_at":"2022-01-09T04:25:56.000000Z","updated_at":"2022-01-09T04:25:56.000000Z","pivot":{"component_id":286,"user_id":6440}},{"id":11023,"name":"interno9","slug":"interno9","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/96354075?v=4","header":null,"created_at":"2023-02-16T13:38:21.000000Z","updated_at":"2023-02-16T13:38:21.000000Z","pivot":{"component_id":286,"user_id":11023}},{"id":13309,"name":"Deepisha1305","slug":"deepisha1305","bio":null,"avatar":"https:\/\/avatars.githubusercontent.com\/u\/139334997?v=4","header":null,"created_at":"2023-07-22T10:58:07.000000Z","updated_at":"2023-07-22T10:58:07.000000Z","pivot":{"component_id":286,"user_id":13309}}]}" :edit="false"> Full screen Preview