Snippets & Blocks
24
Total Snippets
346
Times used
12
Favourite
12
Added Today
Signature Block
Professional email signature
Best regards, {{sender_name}} {{sender_title}} {{company}} {{phone}} | {{email}} {{website}}
78 uses
TEXT
Feb 27, 2024 #signature #contact #professional
Image Gallery
Grid of clickable images
<table class="w-full"><tr><td class="w-1/3 p-1"><img src="{{image_1}}" class="w-full rounded-lg"></td><td class="w-1/3 p-1"><img src="{{image_2}}" class="w-full rounded-lg"></td><td class="w-1/3 p-1"><img src="{{image_3}}" class="w-full rounded-lg"></td></tr></table>
33 uses
HTML
Feb 26, 2024 #gallery #images #visual
Survey CTA
Request for feedback survey
<div class="text-center p-7.5 bg-blue-50 rounded-xl"><h3 class="mb-4">We Value Your Feedback</h3><p class="mb-5 text-gray-500">Help us improve by taking a quick 2-minute survey</p><a href="{{survey_link}}" class="inline-block px-6 py-3 bg-blue-500 text-white no-underline rounded-lg font-semibold">Take Survey</a></div>
45 uses
HTML
Feb 25, 2024 #survey #feedback #engagement
Team Member Card
Team member profile card
<div class="text-center p-5 border border-gray-200 rounded-xl"><img src="{{member_photo}}" class="w-20 h-20 rounded-full mb-4"><h4 class="mb-1">{{member_name}}</h4><p class="m-0 text-gray-500 text-sm">{{member_role}}</p></div>
22 uses
HTML
Feb 24, 2024 #team #profile #member
Emergency Alert
Urgent notification banner
<div class="text-center p-4 bg-[#FEE2E2] border-l-4 border-[#EF4444]"><p class="m-0 text-[#991B1B] font-semibold">⚠️ {{alert_message}}</p></div>
12 uses
HTML
Feb 23, 2024 #alert #urgent #notification
Progress Bar
Visual progress indicator
<div class="bg-gray-200 h-2 rounded overflow-hidden"><div class="bg-indigo-600 h-full w-[{{progress}}%]"></div></div><p class="text-center mt-2.5 text-gray-500 text-sm">{{progress}}% Complete</p>
17 uses
HTML
Feb 22, 2024 #progress #indicator #visual
Stats Highlight
Showcase impressive statistics
<div class="text-center p-7 bg-gray-100 rounded-xl"><div class="text-5xl font-bold text-[#6366F1]">{{stat_number}}</div><div class="mt-2.5 text-gray-500 font-semibold">{{stat_label}}</div></div>
29 uses
HTML
Feb 21, 2024 #stats #numbers #highlight
App Download CTA
Mobile app download buttons
<div class="text-center p-5"><p class="font-semibold mb-4">Download our app</p><div><a href="{{app_store_link}}" class="inline-block mx-2.5"><img src="app-store-badge.png" alt="App Store" class="h-10"></a><a href="{{play_store_link}}" class="inline-block mx-2.5"><img src="google-play-badge.png" alt="Google Play"
class="h-10"></a></div></div>
61 uses
HTML
Feb 20, 2024 #app #download #mobile
Video Thumbnail
Clickable video thumbnail with play button
<a href="{{video_url}}" class="block relative"><img src="{{thumbnail_url}}" class="w-full rounded-xl"><div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[60px] h-[60px] bg-indigo-600/90 rounded-full flex items-center justify-center">▶</div></a>
26 uses
HTML
Feb 19, 2024 #video #media #thumbnail
Price Comparison Table
Side-by-side pricing comparison
<table class="w-full border-collapse"><tr><th class="p-4 border border-gray-200">{{plan_1}}</th><th class="p-4 border border-gray-200">{{plan_2}}</th></tr><tr><td class="p-4 border border-gray-200">{{price_1}}</td><td class="p-4 border border-gray-200">{{price_2}}</td></tr></table>
38 uses
HTML
Feb 18, 2024 #pricing #comparison #table
Minimal Footer
Clean minimal footer with essentials
<div class="text-center p-5 text-gray-400 text-xs"><p>{{company}} | {{address}}</p><p><a href="{{unsubscribe_link}}" class="text-gray-400">Unsubscribe</a></p></div>
44 uses
HTML
Feb 17, 2024 #footer #minimal #clean
Blog Post Preview
Preview card for blog content
<div class="border border-gray-200 rounded-xl overflow-hidden"><img src="{{image_url}}" class="w-full h-auto"><div class="p-5"><h3>{{post_title}}</h3><p>{{post_excerpt}}</p><a href="{{post_url}}" class="text-[#6366F1]">Read More →</a></div></div>
31 uses
HTML
Feb 16, 2024 #blog #content #preview
Countdown Timer
Dynamic countdown timer block
<table class="w-full"><tr><td class="text-center p-3 bg-gray-100 rounded-xl"><div class="text-3xl font-bold text-[#6366F1]">{{days}}</div><div class="text-xs text-gray-500">Days</div></td><td class="text-center p-3 bg-gray-100 rounded-xl"><div class="text-3xl font-bold text-[#6366F1]">12</div><div class="text-xs text-gray-500">Hours</div></td></tr></table>
52 uses
HTML
Feb 15, 2024 #countdown #timer #urgency
Social Proof Banner
Display customer count or testimonials
<div class="text-center p-5 bg-gray-50 rounded-xl"><div class="text-4xl font-bold text-[#6366F1]">{{count}}</div><div class="mt-2 text-gray-500">{{description}}</div></div>
35 uses
HTML
Feb 14, 2024 #social #proof #testimonial
Two Column Layout
Flexible two-column content grid
<table class="w-full"><tr><td class="w-1/2 p-2 align-top"><h4>{{column_1_heading}}</h4><p>{{column_1_content}}</p></td><td class="w-1/2 p-2 align-top"><h4>{{column_2_heading}}</h4><p>{{column_2_content}}</p></td></tr></table>
41 uses
HTML
Feb 13, 2024 #layout #columns #grid
Thank You Message
Gratitude message for customers
<div class="text-center p-6"><div class="text-5xl mb-4">🎉</div><h3 class="mb-3">Thank You!</h3><p>{{thank_you_message}}</p></div>
56 uses
HTML
Feb 12, 2024 #thankyou #gratitude #footer
Emergency Alert
Urgent notification banner
<div class="text-center p-4 bg-[#FEE2E2] border-l-4 border-[#EF4444]"><p class="m-0 text-[#991B1B] font-semibold">⚠️ {{alert_message}}</p></div>
12 uses
HTML
Feb 23, 2024 #alert #urgent #notification
Signature Block
Professional email signature
Best regards, {{sender_name}} {{sender_title}} {{company}} {{phone}} | {{email}} {{website}}
78 uses
TEXT
Feb 27, 2024 #signature #contact #professional
Minimal Footer
Clean minimal footer with essentials
<div class="text-center p-5 text-gray-400 text-xs"><p>{{company}} | {{address}}</p><p><a href="{{unsubscribe_link}}" class="text-gray-400">Unsubscribe</a></p></div>
44 uses
HTML
Feb 17, 2024 #footer #minimal #clean
Thank You Message
Gratitude message for customers
<div class="text-center p-6"><div class="text-5xl mb-4">🎉</div><h3 class="mb-3">Thank You!</h3><p>{{thank_you_message}}</p></div>
56 uses
HTML
Feb 12, 2024 #thankyou #gratitude #footer
Survey CTA
Request for feedback survey
<div class="text-center p-7.5 bg-blue-50 rounded-xl"><h3 class="mb-4">We Value Your Feedback</h3><p class="mb-5 text-gray-500">Help us improve by taking a quick 2-minute survey</p><a href="{{survey_link}}" class="inline-block px-6 py-3 bg-blue-500 text-white no-underline rounded-lg font-semibold">Take Survey</a></div>
45 uses
HTML
Feb 25, 2024 #survey #feedback #engagement
App Download CTA
Mobile app download buttons
<div class="text-center p-5"><p class="font-semibold mb-4">Download our app</p><div><a href="{{app_store_link}}" class="inline-block mx-2.5"><img src="app-store-badge.png" alt="App Store" class="h-10"></a><a href="{{play_store_link}}" class="inline-block mx-2.5"><img src="google-play-badge.png" alt="Google Play"
class="h-10"></a></div></div>
61 uses
HTML
Feb 20, 2024 #app #download #mobile
Countdown Timer
Dynamic countdown timer block
<table class="w-full"><tr><td class="text-center p-3 bg-gray-100 rounded-xl"><div class="text-3xl font-bold text-[#6366F1]">{{days}}</div><div class="text-xs text-gray-500">Days</div></td><td class="text-center p-3 bg-gray-100 rounded-xl"><div class="text-3xl font-bold text-[#6366F1]">12</div><div class="text-xs text-gray-500">Hours</div></td></tr></table>
52 uses
HTML
Feb 15, 2024 #countdown #timer #urgency
Image Gallery
Grid of clickable images
<table class="w-full"><tr><td class="w-1/3 p-1"><img src="{{image_1}}" class="w-full rounded-lg"></td><td class="w-1/3 p-1"><img src="{{image_2}}" class="w-full rounded-lg"></td><td class="w-1/3 p-1"><img src="{{image_3}}" class="w-full rounded-lg"></td></tr></table>
33 uses
HTML
Feb 26, 2024 #gallery #images #visual
Team Member Card
Team member profile card
<div class="text-center p-5 border border-gray-200 rounded-xl"><img src="{{member_photo}}" class="w-20 h-20 rounded-full mb-4"><h4 class="mb-1">{{member_name}}</h4><p class="m-0 text-gray-500 text-sm">{{member_role}}</p></div>
22 uses
HTML
Feb 24, 2024 #team #profile #member
Progress Bar
Visual progress indicator
<div class="bg-gray-200 h-2 rounded overflow-hidden"><div class="bg-indigo-600 h-full w-[{{progress}}%]"></div></div><p class="text-center mt-2.5 text-gray-500 text-sm">{{progress}}% Complete</p>
17 uses
HTML
Feb 22, 2024 #progress #indicator #visual
Stats Highlight
Showcase impressive statistics
<div class="text-center p-7 bg-gray-100 rounded-xl"><div class="text-5xl font-bold text-[#6366F1]">{{stat_number}}</div><div class="mt-2.5 text-gray-500 font-semibold">{{stat_label}}</div></div>
29 uses
HTML
Feb 21, 2024 #stats #numbers #highlight
Video Thumbnail
Clickable video thumbnail with play button
<a href="{{video_url}}" class="block relative"><img src="{{thumbnail_url}}" class="w-full rounded-xl"><div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[60px] h-[60px] bg-indigo-600/90 rounded-full flex items-center justify-center">▶</div></a>
26 uses
HTML
Feb 19, 2024 #video #media #thumbnail
Price Comparison Table
Side-by-side pricing comparison
<table class="w-full border-collapse"><tr><th class="p-4 border border-gray-200">{{plan_1}}</th><th class="p-4 border border-gray-200">{{plan_2}}</th></tr><tr><td class="p-4 border border-gray-200">{{price_1}}</td><td class="p-4 border border-gray-200">{{price_2}}</td></tr></table>
38 uses
HTML
Feb 18, 2024 #pricing #comparison #table
Blog Post Preview
Preview card for blog content
<div class="border border-gray-200 rounded-xl overflow-hidden"><img src="{{image_url}}" class="w-full h-auto"><div class="p-5"><h3>{{post_title}}</h3><p>{{post_excerpt}}</p><a href="{{post_url}}" class="text-[#6366F1]">Read More →</a></div></div>
31 uses
HTML
Feb 16, 2024 #blog #content #preview
Social Proof Banner
Display customer count or testimonials
<div class="text-center p-5 bg-gray-50 rounded-xl"><div class="text-4xl font-bold text-[#6366F1]">{{count}}</div><div class="mt-2 text-gray-500">{{description}}</div></div>
35 uses
HTML
Feb 14, 2024 #social #proof #testimonial
Two Column Layout
Flexible two-column content grid
<table class="w-full"><tr><td class="w-1/2 p-2 align-top"><h4>{{column_1_heading}}</h4><p>{{column_1_content}}</p></td><td class="w-1/2 p-2 align-top"><h4>{{column_2_heading}}</h4><p>{{column_2_content}}</p></td></tr></table>
41 uses
HTML
Feb 13, 2024 #layout #columns #grid