Card by themrsami
#e8e8e8
HTML +TailwindCSS
1<div class="max-w-xl w-full mx-auto bg-gray-900 rounded-xl overflow-hidden"> 2 <div class="max-w-md mx-auto pt-12 pb-14 px-5 text-center"> 3 <div 4 class="inline-flex items-center justify-center w-12 h-12 mb-5 rounded-full" 5 > 6 <svg 7 viewBox="0 0 48 48" 8 height="100" 9 width="100" 10 y="0px" 11 x="0px" 12 xmlns="http://www.w3.org/2000/svg" 13 > 14 <linearGradient 15 gradientUnits="userSpaceOnUse" 16 y2="37.081" 17 y1="10.918" 18 x2="10.918" 19 x1="37.081" 20 id="SVGID_1__8tZkVc2cOjdg_gr1" 21 > 22 <stop stop-color="#60fea4" offset="0"></stop> 23 <stop stop-color="#6afeaa" offset=".033"></stop> 24 <stop stop-color="#97fec4" offset=".197"></stop> 25 <stop stop-color="#bdffd9" offset=".362"></stop> 26 <stop stop-color="#daffea" offset=".525"></stop> 27 <stop stop-color="#eefff5" offset=".687"></stop> 28 <stop stop-color="#fbfffd" offset=".846"></stop> 29 <stop stop-color="#fff" offset="1"></stop> 30 </linearGradient> 31 <circle 32 fill="url(#SVGID_1__8tZkVc2cOjdg_gr1)" 33 r="18.5" 34 cy="24" 35 cx="24" 36 ></circle> 37 <path 38 d="M35.401,38.773C32.248,41.21,28.293,42.66,24,42.66C13.695,42.66,5.34,34.305,5.34,24 c0-2.648,0.551-5.167,1.546-7.448" 39 stroke-width="3" 40 stroke-miterlimit="10" 41 stroke-linejoin="round" 42 stroke-linecap="round" 43 stroke="#10e36c" 44 fill="none" 45 ></path> 46 <path 47 d="M12.077,9.646C15.31,6.957,19.466,5.34,24,5.34c10.305,0,18.66,8.354,18.66,18.66 c0,2.309-0.419,4.52-1.186,6.561" 48 stroke-width="3" 49 stroke-miterlimit="10" 50 stroke-linejoin="round" 51 stroke-linecap="round" 52 stroke="#10e36c" 53 fill="none" 54 ></path> 55 <polyline 56 points="16.5,23.5 21.5,28.5 32,18" 57 stroke-width="3" 58 stroke-miterlimit="10" 59 stroke-linejoin="round" 60 stroke-linecap="round" 61 stroke="#10e36c" 62 fill="none" 63 ></polyline> 64 </svg> 65 </div> 66 <h4 class="text-xl text-gray-100 font-semibold mb-5"> 67 Your account is activated! 68 </h4> 69 <p class="text-gray-300 font-medium"> 70 Account has been verified Successfully. 71 </p> 72 </div> 73 <div class="pt-5 pb-6 px-6 text-right bg-gray-800 -mb-2"> 74 <a 75 href="#" 76 class="inline-block w-full sm:w-auto py-3 px-5 mb-2 mr-4 text-center font-semibold leading-6 text-gray-200 bg-gray-500 hover:bg-gray-400 rounded-lg transition duration-200" 77 >Cancel</a 78 ><a 79 href="#" 80 class="inline-block w-full sm:w-auto py-3 px-5 mb-2 text-center font-semibold leading-6 text-blue-50 bg-green-500 hover:bg-green-600 rounded-lg transition duration-200" 81 >Confirm</a 82 > 83 </div> 84</div> 85
69 views
69 views
MIT License