Home
Pagedone
Newsletter with address location

Newsletter with address location

Use this example to first show brand logo card, then show address locations of your company, a newsletter sign-up form.

This tailwind example is contributed by Pagedone, on 02-May-2024. Component is made with Tailwind CSS v3. It is responsive.

Footer

Author Pagedone

2.5k

Fork Fullscreen

<footer class="w-full">
        <div class="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
            
            <div class="py-14 grid grid-cols-12 gap-x-5 gap-y-8">
                <div class="col-span-full xl:col-span-3 relative bg-gradient-to-tr from-indigo-600 to-violet-600 rounded-2xl gap-12 p-6 xl:w-72 h-96 flex flex-col justify-center items-center">
                    
                    <a href="https://pagedone.io/" class="flex justify-center lg:justify-start">
                        <svg class="w-40 h-8" viewBox="0 0 165 34" fill="none" xmlns="http://www.w3.org/2000/svg">
                            <path
                                d="M47.5 25.6059V7.88281H54.9171C55.0916 7.88281 55.316 7.89102 55.5903 7.90743C55.8645 7.91563 56.118 7.94025 56.3507 7.98127C57.3895 8.13717 58.2455 8.47768 58.9186 9.00281C59.6001 9.52794 60.1029 10.1926 60.427 10.9967C60.7594 11.7926 60.9256 12.6787 60.9256 13.6551C60.9256 14.6233 60.7594 15.5095 60.427 16.3136C60.0945 17.1095 59.5876 17.77 58.9061 18.2951C58.233 18.8202 57.3812 19.1608 56.3507 19.3167C56.118 19.3495 55.8604 19.3741 55.5778 19.3905C55.3035 19.4069 55.0833 19.4151 54.9171 19.4151H50.5042V25.6059H47.5ZM50.5042 16.6459H54.7925C54.9587 16.6459 55.1457 16.6377 55.3534 16.6213C55.5612 16.6049 55.7523 16.572 55.9268 16.5228C56.4255 16.3997 56.8161 16.1823 57.0986 15.8705C57.3895 15.5587 57.5931 15.2059 57.7094 14.812C57.8341 14.4182 57.8964 14.0326 57.8964 13.6551C57.8964 13.2777 57.8341 12.892 57.7094 12.4982C57.5931 12.0961 57.3895 11.7392 57.0986 11.4274C56.8161 11.1156 56.4255 10.8982 55.9268 10.7751C55.7523 10.7259 55.5612 10.6972 55.3534 10.689C55.1457 10.6726 54.9587 10.6644 54.7925 10.6644H50.5042V16.6459Z"
                                fill="white" />
                            <path
                                d="M66.5975 25.9751C65.6252 25.9751 64.8024 25.7946 64.1293 25.4336C63.4561 25.0644 62.945 24.5761 62.596 23.969C62.2553 23.3618 62.0849 22.6931 62.0849 21.9628C62.0849 21.3228 62.1929 20.7485 62.409 20.2397C62.6251 19.7228 62.9575 19.2797 63.4063 18.9105C63.855 18.5331 64.4368 18.2254 65.1515 17.9874C65.6917 17.8151 66.3233 17.6592 67.0463 17.5197C67.7776 17.3802 68.5671 17.2531 69.4148 17.1382C70.2707 17.0151 71.1641 16.8838 72.0949 16.7444L71.0228 17.3474C71.0311 16.4285 70.8234 15.7515 70.3995 15.3167C69.9757 14.8818 69.261 14.6644 68.2554 14.6644C67.6488 14.6644 67.0629 14.8038 66.4978 15.0828C65.9327 15.3618 65.5379 15.8418 65.3135 16.5228L62.5711 15.6736C62.9035 14.5495 63.5351 13.6469 64.4659 12.9659C65.4049 12.2849 66.6681 11.9444 68.2554 11.9444C69.4522 11.9444 70.5034 12.1372 71.4093 12.5228C72.3234 12.9085 73.0007 13.5402 73.4412 14.4182C73.6822 14.8859 73.8276 15.3659 73.8775 15.8582C73.9274 16.3423 73.9523 16.8715 73.9523 17.4459V25.6059H71.322V22.7259L71.7583 23.1936C71.1517 24.1536 70.4411 24.8592 69.6267 25.3105C68.8206 25.7536 67.8108 25.9751 66.5975 25.9751ZM67.1959 23.612C67.8773 23.612 68.4591 23.4931 68.9411 23.2551C69.4231 23.0172 69.8054 22.7259 70.0879 22.3813C70.3788 22.0367 70.5741 21.7126 70.6738 21.409C70.8317 21.0315 70.919 20.6008 70.9356 20.1167C70.9605 19.6244 70.973 19.2264 70.973 18.9228L71.8954 19.1936C70.9896 19.3331 70.2126 19.4561 69.5643 19.5628C68.9161 19.6695 68.3593 19.772 67.8939 19.8705C67.4286 19.9608 67.0172 20.0633 66.6598 20.1782C66.3108 20.3013 66.0158 20.4449 65.7748 20.609C65.5338 20.7731 65.3468 20.9618 65.2138 21.1751C65.0891 21.3885 65.0268 21.6387 65.0268 21.9259C65.0268 22.2541 65.1099 22.5454 65.2761 22.7997C65.4423 23.0459 65.6833 23.2428 65.9991 23.3905C66.3233 23.5382 66.7222 23.612 67.1959 23.612Z"
                                fill="white" />
                            <path
                                d="M82.6078 31.8828C81.8598 31.8828 81.141 31.7679 80.4512 31.5382C79.7698 31.3085 79.1548 30.9761 78.6063 30.5413C78.0578 30.1146 77.609 29.5977 77.26 28.9905L80.0274 27.6367C80.285 28.1208 80.6465 28.4777 81.1119 28.7074C81.5856 28.9454 82.0884 29.0644 82.6203 29.0644C83.2435 29.0644 83.8003 28.9536 84.2907 28.732C84.781 28.5187 85.1591 28.1987 85.425 27.772C85.6993 27.3536 85.8281 26.8285 85.8115 26.1967V22.4182H86.1855V12.3136H88.8157V26.2459C88.8157 26.5823 88.7991 26.9023 88.7659 27.2059C88.7409 27.5177 88.6952 27.8213 88.6287 28.1167C88.4293 28.9782 88.047 29.6838 87.4819 30.2336C86.9168 30.7915 86.2145 31.2059 85.3752 31.4767C84.5441 31.7474 83.6217 31.8828 82.6078 31.8828ZM82.346 25.9751C81.1077 25.9751 80.0274 25.6674 79.1049 25.052C78.1825 24.4367 77.4678 23.5997 76.9608 22.5413C76.4539 21.4828 76.2004 20.289 76.2004 18.9597C76.2004 17.6141 76.4539 16.4161 76.9608 15.3659C77.4761 14.3074 78.2032 13.4746 79.1423 12.8674C80.0814 12.252 81.1867 11.9444 82.4582 11.9444C83.738 11.9444 84.8101 12.252 85.6744 12.8674C86.547 13.4746 87.2076 14.3074 87.6564 15.3659C88.1052 16.4244 88.3296 17.6223 88.3296 18.9597C88.3296 20.2808 88.1052 21.4746 87.6564 22.5413C87.2076 23.5997 86.5387 24.4367 85.6494 25.052C84.7602 25.6674 83.6591 25.9751 82.346 25.9751ZM82.8072 23.3167C83.6134 23.3167 84.2616 23.1361 84.7519 22.7751C85.2505 22.4059 85.612 21.8931 85.8364 21.2367C86.0691 20.5802 86.1855 19.8213 86.1855 18.9597C86.1855 18.09 86.0691 17.331 85.8364 16.6828C85.612 16.0264 85.2588 15.5177 84.7768 15.1567C84.2948 14.7874 83.6715 14.6028 82.907 14.6028C82.1008 14.6028 81.436 14.7997 80.9124 15.1936C80.3889 15.5792 80.0024 16.1044 79.7531 16.769C79.5038 17.4254 79.3792 18.1556 79.3792 18.9597C79.3792 19.772 79.4997 20.5105 79.7407 21.1751C79.99 21.8315 80.3681 22.3526 80.875 22.7382C81.382 23.1238 82.0261 23.3167 82.8072 23.3167Z"
                                fill="white" />
                            <path
                                d="M98.1827 25.9751C96.8198 25.9751 95.6231 25.6838 94.5926 25.1013C93.5621 24.5187 92.756 23.7105 92.1743 22.6767C91.6008 21.6428 91.3141 20.4531 91.3141 19.1074C91.3141 17.6551 91.5967 16.3956 92.1618 15.329C92.7269 14.2541 93.5122 13.4213 94.5178 12.8305C95.5234 12.2397 96.6869 11.9444 98.0082 11.9444C99.4044 11.9444 100.589 12.2685 101.561 12.9167C102.542 13.5567 103.269 14.4633 103.742 15.6367C104.216 16.81 104.395 18.1926 104.278 19.7844H101.299V18.7013C101.291 17.2572 101.033 16.2028 100.526 15.5382C100.019 14.8736 99.2216 14.5413 98.1329 14.5413C96.9029 14.5413 95.9888 14.9187 95.3904 15.6736C94.7921 16.4202 94.4929 17.5156 94.4929 18.9597C94.4929 20.3054 94.7921 21.3474 95.3904 22.0859C95.9888 22.8244 96.8614 23.1936 98.0082 23.1936C98.7479 23.1936 99.3836 23.0336 99.9155 22.7136C100.456 22.3854 100.871 21.9136 101.162 21.2982L104.129 22.1844C103.614 23.3823 102.816 24.3136 101.735 24.9782C100.663 25.6428 99.4792 25.9751 98.1827 25.9751ZM93.5455 19.7844V17.5444H102.808V19.7844H93.5455Z"
                                fill="white" />
                            <path
                                d="M112.208 25.9751C110.97 25.9751 109.89 25.6674 108.967 25.052C108.045 24.4367 107.33 23.5997 106.823 22.5413C106.316 21.4828 106.063 20.289 106.063 18.9597C106.063 17.6141 106.316 16.4161 106.823 15.3659C107.338 14.3074 108.065 13.4746 109.005 12.8674C109.944 12.252 111.049 11.9444 112.32 11.9444C113.6 11.9444 114.672 12.252 115.537 12.8674C116.409 13.4746 117.07 14.3074 117.519 15.3659C117.967 16.4244 118.192 17.6223 118.192 18.9597C118.192 20.2808 117.967 21.4746 117.519 22.5413C117.07 23.5997 116.401 24.4367 115.512 25.052C114.622 25.6674 113.521 25.9751 112.208 25.9751ZM112.669 23.3167C113.476 23.3167 114.124 23.1361 114.614 22.7751C115.113 22.4059 115.474 21.8931 115.699 21.2367C115.931 20.5802 116.048 19.8213 116.048 18.9597C116.048 18.09 115.931 17.331 115.699 16.6828C115.474 16.0264 115.121 15.5177 114.639 15.1567C114.157 14.7874 113.534 14.6028 112.769 14.6028C111.963 14.6028 111.298 14.7997 110.775 15.1936C110.251 15.5792 109.865 16.1044 109.615 16.769C109.366 17.4254 109.241 18.1556 109.241 18.9597C109.241 19.772 109.362 20.5105 109.603 21.1751C109.852 21.8315 110.23 22.3526 110.737 22.7382C111.244 23.1238 111.888 23.3167 112.669 23.3167ZM116.048 25.6059V16.2767H115.674V7.88281H118.703V25.6059H116.048Z"
                                fill="white" />
                            <path
                                d="M127.895 25.9751C126.549 25.9751 125.373 25.6756 124.367 25.0767C123.361 24.4777 122.58 23.6531 122.023 22.6028C121.475 21.5443 121.201 20.33 121.201 18.9597C121.201 17.5649 121.483 16.3423 122.048 15.292C122.613 14.2418 123.399 13.4213 124.404 12.8305C125.41 12.2397 126.573 11.9444 127.895 11.9444C129.249 11.9444 130.43 12.2438 131.435 12.8428C132.441 13.4418 133.222 14.2705 133.779 15.329C134.335 16.3792 134.614 17.5895 134.614 18.9597C134.614 20.3382 134.331 21.5567 133.766 22.6151C133.209 23.6654 132.428 24.49 131.423 25.089C130.417 25.6797 129.241 25.9751 127.895 25.9751ZM127.895 23.1936C129.092 23.1936 129.981 22.7997 130.562 22.012C131.144 21.2244 131.435 20.2069 131.435 18.9597C131.435 17.6715 131.14 16.6459 130.55 15.8828C129.96 15.1115 129.075 14.7259 127.895 14.7259C127.089 14.7259 126.424 14.9064 125.9 15.2674C125.385 15.6202 125.003 16.1167 124.753 16.7567C124.504 17.3885 124.379 18.1228 124.379 18.9597C124.379 20.2479 124.674 21.2777 125.265 22.049C125.863 22.812 126.74 23.1936 127.895 23.1936Z"
                                fill="white" />
                            <path
                                d="M146.423 25.6059V19.2059C146.423 18.7874 146.394 18.3238 146.336 17.8151C146.278 17.3064 146.14 16.8182 145.924 16.3505C145.717 15.8746 145.401 15.4849 144.977 15.1813C144.561 14.8777 143.996 14.7259 143.282 14.7259C142.899 14.7259 142.521 14.7874 142.147 14.9105C141.773 15.0336 141.433 15.2469 141.125 15.5505C140.826 15.8459 140.585 16.2561 140.402 16.7813C140.219 17.2982 140.128 17.9628 140.128 18.7751L138.345 18.0244C138.345 16.892 138.565 15.8664 139.006 14.9474C139.455 14.0285 140.111 13.2982 140.975 12.7567C141.84 12.2069 142.903 11.932 144.167 11.932C145.164 11.932 145.987 12.0961 146.635 12.4244C147.283 12.7526 147.798 13.171 148.181 13.6797C148.563 14.1885 148.845 14.73 149.028 15.3044C149.211 15.8787 149.327 16.4244 149.377 16.9413C149.436 17.45 149.465 17.8644 149.465 18.1844V25.6059H146.423ZM137.086 25.6059V12.3136H139.766V16.4367H140.128V25.6059H137.086Z"
                                fill="white" />
                            <path
                                d="M158.37 25.9751C157.007 25.9751 155.81 25.6838 154.78 25.1013C153.749 24.5187 152.943 23.7105 152.361 22.6767C151.788 21.6428 151.501 20.4531 151.501 19.1074C151.501 17.6551 151.784 16.3956 152.349 15.329C152.914 14.2541 153.699 13.4213 154.705 12.8305C155.71 12.2397 156.874 11.9444 158.195 11.9444C159.591 11.9444 160.776 12.2685 161.748 12.9167C162.729 13.5567 163.456 14.4633 163.93 15.6367C164.403 16.81 164.582 18.1926 164.466 19.7844H161.486V18.7013C161.478 17.2572 161.22 16.2028 160.713 15.5382C160.206 14.8736 159.409 14.5413 158.32 14.5413C157.09 14.5413 156.176 14.9187 155.578 15.6736C154.979 16.4202 154.68 17.5156 154.68 18.9597C154.68 20.3054 154.979 21.3474 155.578 22.0859C156.176 22.8244 157.048 23.1936 158.195 23.1936C158.935 23.1936 159.571 23.0336 160.103 22.7136C160.643 22.3854 161.058 21.9136 161.349 21.2982L164.316 22.1844C163.801 23.3823 163.003 24.3136 161.923 24.9782C160.851 25.6428 159.666 25.9751 158.37 25.9751ZM153.733 19.7844V17.5444H162.995V19.7844H153.733Z"
                                fill="white" />
                            <path
                                d="M25.0473 12.7769C25.6905 13.3891 25.7068 14.3977 25.0837 15.0296L19.2585 20.9369C18.6354 21.5688 17.6087 21.5848 16.9654 20.9726C16.3222 20.3604 16.3059 19.3518 16.929 18.7199L22.7542 12.8127C23.3773 12.1807 24.404 12.1647 25.0473 12.7769Z"
                                fill="white" />
                            <path fill-rule="evenodd" clip-rule="evenodd"
                                d="M0.5 5.42955C0.5 2.91846 2.57211 0.882812 5.12819 0.882812H22.0399V0.884053C29.4908 0.982665 35.5 6.9471 35.5 14.2904C35.5 21.6951 29.3897 27.6979 21.8523 27.6979C19.1648 27.6979 16.6587 26.9348 14.5463 25.617L7.08815 32.7885C4.63431 35.148 0.5 33.4401 0.5 30.0669V5.42955ZM12.0194 23.5883C9.65709 21.1778 8.20452 17.9007 8.20452 14.2904C8.20452 13.4105 8.93056 12.6972 9.82619 12.6972C10.7218 12.6972 11.4479 13.4105 11.4479 14.2904C11.4479 19.9354 16.1061 24.5116 21.8523 24.5116C27.5985 24.5116 32.2567 19.9354 32.2567 14.2904C32.2567 8.6453 27.5985 4.06907 21.8523 4.06907H5.12819C4.36336 4.06907 3.74334 4.67818 3.74334 5.42955V30.0669C3.74334 30.6179 4.41866 30.8968 4.81948 30.5114L12.0194 23.5883Z"
                                fill="white" />
                        </svg>
                    </a>
                    <p class="text-center text-gray-200">Trusted in more than 100 countries & 5 million customers.
                        Have any query? contact us we are here for you.</p>
                   
                    <div class="flex  space-x-4 sm:justify-center  ">
                        <a href="javascript:;"
                            class="w-9 h-9 rounded-full bg-white flex justify-center items-center hover:shadow-md">
                            <svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 21 21"
                                fill="none">
                                <g id="Social Media">
                                    <path id="Vector"
                                        d="M11.8214 9.81691L16.9919 3.93591H15.7667L11.2772 9.0423L7.6914 3.93591H3.55566L8.97803 11.6577L3.55566 17.8248H4.78097L9.522 12.4323L13.3088 17.8248H17.4446L11.8211 9.81691H11.8214ZM10.1432 11.7257L9.59382 10.9568L5.22246 4.83846H7.10445L10.6322 9.77615L11.1816 10.5451L15.7672 16.9633H13.8852L10.1432 11.726V11.7257Z"
                                        fill="url(#paint0_linear_9147_17049)" />
                                </g>
                            </svg>

</a>
                        <a href="javascript:;"
                            class="w-9 h-9 rounded-full bg-white flex justify-center items-center hover:shadow-md">
                            <svg class="w-[1.25rem] h-[1.125rem]" viewBox="0 0 15 15" fill="none"
                                xmlns="http://www.w3.org/2000/svg">
                                <path
                                    d="M5.20975 7.81944C5.20975 6.54106 6.26102 5.50444 7.5582 5.50444C8.85537 5.50444 9.90721 6.54106 9.90721 7.81944C9.90721 9.09783 8.85537 10.1344 7.5582 10.1344C6.26102 10.1344 5.20975 9.09783 5.20975 7.81944ZM3.93991 7.81944C3.93991 9.78889 5.55982 11.3853 7.5582 11.3853C9.55658 11.3853 11.1765 9.78889 11.1765 7.81944C11.1765 5.85 9.55658 4.25356 7.5582 4.25356C5.55982 4.25356 3.93991 5.85 3.93991 7.81944ZM10.4741 4.11217C10.4741 4.27698 10.5236 4.43812 10.6165 4.5752C10.7093 4.71228 10.8413 4.81914 10.9958 4.88227C11.1503 4.94541 11.3203 4.96198 11.4844 4.92989C11.6484 4.8978 11.7991 4.81849 11.9174 4.70199C12.0357 4.58549 12.1163 4.43704 12.149 4.2754C12.1817 4.11376 12.165 3.9462 12.1011 3.79391C12.0371 3.64161 11.9288 3.51142 11.7898 3.41979C11.6508 3.32817 11.4873 3.27923 11.3201 3.27917H11.3197C11.0955 3.27927 10.8806 3.36705 10.722 3.52324C10.5635 3.67943 10.4743 3.89124 10.4741 4.11217ZM4.71142 13.4721C4.02442 13.4412 3.65101 13.3284 3.40286 13.2332C3.07387 13.1069 2.83914 12.9566 2.59235 12.7137C2.34555 12.4708 2.19278 12.2397 2.06527 11.9155C1.96854 11.6711 1.8541 11.3029 1.82287 10.6259C1.78871 9.89389 1.78189 9.674 1.78189 7.8195C1.78189 5.965 1.78927 5.74572 1.82287 5.01311C1.85416 4.33606 1.96944 3.96867 2.06527 3.7235C2.19335 3.39928 2.34589 3.16794 2.59235 2.92472C2.8388 2.6815 3.07331 2.53094 3.40286 2.40528C3.6509 2.30994 4.02442 2.19717 4.71142 2.16639C5.45417 2.13272 5.67729 2.126 7.5582 2.126C9.4391 2.126 9.66244 2.13328 10.4058 2.16639C11.0928 2.19722 11.4656 2.31083 11.7144 2.40528C12.0434 2.53094 12.2781 2.68183 12.5249 2.92472C12.7717 3.16761 12.9239 3.39928 13.052 3.7235C13.1487 3.96794 13.2631 4.33606 13.2944 5.01311C13.3285 5.74572 13.3354 5.965 13.3354 7.8195C13.3354 9.674 13.3285 9.89328 13.2944 10.6259C13.2631 11.3029 13.1481 11.6709 13.052 11.9155C12.9239 12.2397 12.7714 12.4711 12.5249 12.7137C12.2784 12.9564 12.0434 13.1069 11.7144 13.2332C11.4663 13.3285 11.0928 13.4413 10.4058 13.4721C9.66306 13.5057 9.43994 13.5124 7.5582 13.5124C5.67645 13.5124 5.45395 13.5057 4.71142 13.4721ZM4.65307 0.917056C3.90294 0.950722 3.39035 1.06794 2.9427 1.23961C2.4791 1.41689 2.08663 1.65472 1.69446 2.04061C1.30228 2.4265 1.06157 2.81389 0.881687 3.27078C0.707498 3.71222 0.588554 4.21711 0.554392 4.95639C0.519667 5.69683 0.511719 5.93356 0.511719 7.81944C0.511719 9.70533 0.519667 9.94206 0.554392 10.6825C0.588554 11.4218 0.707498 11.9267 0.881687 12.3681C1.06157 12.8247 1.30233 13.2126 1.69446 13.5983C2.08658 13.984 2.4791 14.2215 2.9427 14.3993C3.39119 14.5709 3.90294 14.6882 4.65307 14.7218C5.40479 14.7555 5.6446 14.7639 7.5582 14.7639C9.4718 14.7639 9.712 14.7561 10.4633 14.7218C11.2135 14.6882 11.7258 14.5709 12.1737 14.3993C12.637 14.2215 13.0298 13.9842 13.4219 13.5983C13.8141 13.2124 14.0543 12.8247 14.2347 12.3681C14.4089 11.9267 14.5284 11.4218 14.562 10.6825C14.5962 9.9415 14.6041 9.70533 14.6041 7.81944C14.6041 5.93356 14.5962 5.69683 14.562 4.95639C14.5278 4.21706 14.4089 3.71194 14.2347 3.27078C14.0543 2.81417 13.8135 2.42711 13.4219 2.04061C13.0304 1.65411 12.637 1.41689 12.1743 1.23961C11.7258 1.06794 11.2135 0.950167 10.4639 0.917056C9.71256 0.883389 9.47236 0.875 7.55876 0.875C5.64516 0.875 5.40479 0.882833 4.65307 0.917056Z"
                                    fill="url(#paint0_linear_9147_17049)" />
                                <defs>
                                    <linearGradient id="paint0_linear_9147_17049" x1="14.6041" y1="1.67072"
                                        x2="0.399812" y2="14.3286" gradientUnits="userSpaceOnUse">
                                        <stop stop-color="#7C3AED" />
                                        <stop offset="0.993738" stop-color="#4F46E5" />
                                    </linearGradient>
                                </defs>
                            </svg>

</a>
                        <a href="javascript:;"
                            class="w-9 h-9 rounded-full bg-white flex justify-center items-center hover:shadow-md">

</a>
                        <a href="javascript:;"
                            class="w-9 h-9 rounded-full bg-white flex justify-center items-center hover:shadow-md">

</a>
                    </div>
                </div>

<div class="block text-center xl:text-left xl:py-16 col-span-full min-[500px]:col-span-6 md:col-span-4 xl:col-span-3 xl:pl-5">
                    <h4 class="text-lg text-gray-900 font-bold mb-9">Get In Touch</h4>
                    <ul class="text-gray-900 transition-all duration-500 grid gap-6">
                        <li>support@pagedone.com</li>
                        <li>+91 945 658 3256</li>
                        <li>61-A, Elm street, Gujarat, India.</li>
                    </ul>
                </div>
                <div class="block xl:py-16 col-span-full min-[500px]:col-span-6 md:col-span-4 xl:col-span-3">
                    <h4 class="text-lg text-gray-900 font-bold mb-9 text-center xl:text-left">Quick Links</h4>
                    <div class="flex gap-6 xl:gap-12 max-xl:justify-center">
                        <ul class="text-gray-600 transition-all duration-500 grid gap-6">
                            <li><a href="javascript:;">Home</a></li>
                            <li><a href="javascript:;">FAQs</a></li>
                            <li><a href="javascript:;">Price Plan</a></li>
                            <li><a href="javascript:;">Features</a></li>
                        </ul>
                        <ul class="text-gray-600 transition-all duration-500 grid gap-6">
                            <li><a href="javascript:;">Careers</a></li>
                            <li><a href="javascript:;">About </a></li>
                            <li><a href="javascript:;">Contact</a></li>
                            <li><a href="javascript:;">Products</a></li>
                        </ul>
                    </div>
                </div>
                <div class="block xl:py-16 col-span-full md:col-span-4 xl:col-span-3">
                    <h4 class="text-lg text-gray-900 font-bold mb-9 text-center xl:text-left">Newsletter</h4>
                    <div class="grid gap-7 ">
                        <input type="text" name="email"
                            class="py-2 px-4 border border-gray-300 shadow-sm h-14 text-lg text-gray-800 rounded-full w-full  xl:w-64 placeholder:text-gray-400 focus:outline-none"
                            placeholder="Enter email.." />
                        <button type="submit"
                            class="flex gap-2 justify-center items-center py-3.5 px-7 rounded-full text-white bg-indigo-600 shadow-md w-fit transition-all duration-500 mx-auto xl:mx-0 hover:bg-indigo-700">Subscribe<svg
                                width="17" height="13" viewBox="0 0 17 13" fill="none"
                                xmlns="http://www.w3.org/2000/svg">
                                <path
                                    d="M1.5 6.88281L14.8333 6.88281M10.6667 11.8828L15.0774 7.47207C15.3552 7.19429 15.4941 7.0554 15.4941 6.88281C15.4941 6.71022 15.3552 6.57133 15.0774 6.29356L10.6667 1.88281"
                                    stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
                            </svg>
                        </button>
                    </div>
                </div>

</div>
            
        </div>
        <div class="py-4 bg-indigo-50">
            <div class="flex items-center justify-center">
                <span class="text-sm text-gray-800 ">Copyright@2024 All Right Reserved  by <a href="https://pagedone.io/">pagedone</a></span>
            </div>
        </div>

</footer>

Related Examples

Footer with social media icons
If you want to use colorful social media icons with address location, sitemap links and newsletter.

Author:
Pagedone

1 year ago

3k
Responsive footer
Footer section with icons

Author:
Prajwal Hallale

2 years ago

12.5k
Small Footer

Author:
Abhijit Sen

2 years ago

11.5k
beautifull footer
We create a Advance animated footer section using tailwindcss and custom css

Author:
Akram Khan

1 year ago

2.2k
Footer
Footer with responsive desing

Author:
Rajesh Maheshwari

7 months ago

997
Responsive eCommerce Footer Component with Tailwind CSS
A modern, fully responsive eCommerce footer component built with Tailwind CSS. It includes multiple sections like company info, account links, help center, categories, social media icons, payment methods, and app download buttons. Optimized for seamless mobile and desktop experiences, making it perfect for any online store or business website.

Author:
SHARIFUL ISLAM

7 months ago

758
Big footer with lots of links

Author:
Henrik R.

1 year ago

3.4k
Footer with social icons

Author:
Mr Robot

3 years ago

15.5k
Footer

Author:
Maxim

6 months ago

923
Footer with mobile accordion
A modern dark-themed footer component built with Tailwind CSS, featuring a responsive 5-column grid layout for desktop that transforms into an accordion menu on mobile devices. Perfect for beverage, e-commerce, or corporate websites, it includes organized navigation categories, hover effects on links, social media integration, and a clean copyright section - all styled with a professional stone-gray color scheme.

Author:
Maxim

9 months ago

899
Dark Footer with subscribe form
Use below exmaple of Tailwind CSS Dark Footer with Newsletter Subscription Form with brand logo and site links.

Author:
Pagedone

1 year ago

2.7k
Tailwind Footer with dark version
This example can be used if you are looking for four column footer in dark version with sitemap links, brand logo, and social media accounts.

Author:
Pagedone

1 year ago

3.2k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components