PageSourceSearch

https://clicksnap.live/

html clicksnap.live collected 2026-10-02 01:59:30 UTC 225,357 bytes, 306 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en" class="scroll-smooth">
3  <head>
4    <!-- Google tag (gtag.js) -->
vendor: 68 bytes, lines 4-5
4
5    <script async src="https://www.googletagmanager.com/gtag/js?id=
5G-JRKKY474WC
vendor: 16 bytes, lines 5-6
5"></script>
6    
6<script>
7      
vendor: 146 bytes, lines 7-11
7window.dataLayer = window.dataLayer || [];
8      function gtag(){dataLayer.push(arguments);}
9      gtag('js', new Date());
10
11      gtag('config', '
11G-JRKKY474WC
vendor: 8 bytes, lines 11-12
11');
12    
12</script>
12
13    <meta charset="UTF-8" />
14    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
15    <title>ClickSnap - Free Full-Page Screenshot &amp; Annotation Chrome Extension</title>
16    <meta name="description" content="Capture full scrolling web pages with automated sticky header suppression, annotate with 14 vector tools, blur private API keys, and export 2x Retina mockup frames. 100% free &amp; private." />
17    <meta
18      name="keywords"
19      content="full page screenshot chrome extension, scrolling screenshot chrome, screen recorder extension, animated gif recorder 60fps, offline ocr text grabber, auto blur sensitive data, 3d screenshot mockup generator, gofullpage alternative free, awesome screenshot alternative, cleanshot x alternative windows, private screenshot tool, client side annotation studio"
20    />
21    <meta name="author" content="Sarangan Raviraj, Sahana Ravichandran" />
22    <!-- Google Search Console Site Verification -->
23    <meta name="google-site-verification" content="43tXxE_r2omAdu-YqaEZjCZ8Cdrow2cwWN9CEvIs990" />
24
25    <!-- Technical SEO & Mobile PWA Meta -->
26    <link rel="canonical" href="https://clicksnap.live/" />
27    <meta name="theme-color" content="#0F172A" />
28    <meta name="application-name" content="ClickSnap" />
29    <meta name="apple-mobile-web-app-title" content="ClickSnap" />
30    <meta name="apple-mobile-web-app-capable" content="yes" />
31    <meta name="apple-mobile-web-app-status-bar-style" content="default" />
32    <meta name="format-detection" content="telephone=no" />
33
34    <!-- OpenGraph / Facebook / LinkedIn / Discord Cards -->
35    <meta property="og:type" content="website" />
36    <meta property="og:site_name" content="ClickSnap Studio" />
37    <meta property="og:locale" content="en_US" />
38    <meta property="og:url" content="https://clicksnap.live/" />
39    <meta property="og:title" content="ClickSnap - Free Full-Page Screenshot &amp; Annotation Chrome Extension" />
40    <meta property="og:description" content="Capture full scrolling web pages with smart sticky header suppression, annotate with 14 tools, blur sensitive tokens, record 60 FPS GIFs, and extract offline OCR text. 100% Client-Side Privacy." />
41    <meta property="og:image" content="https://clicksnap.live/store-assets/marquee-promo-1400x560.png" />
42    <meta property="og:image:width" content="1400" />
43    <meta property="og:image:height" content="560" />
44    <meta property="og:image:alt" content="ClickSnap Full-Page Screenshot &amp; Visual Annotation Studio" />
45    <meta property="og:image:type" content="image/png" />
46
47    <!-- Twitter / X Card Meta -->
48    <meta name="twitter:card" content="summary_large_image" />
49    <meta name="twitter:url" content="https://clicksnap.live/" />
50    <meta name="twitter:title" content="ClickSnap - Free Full-Page Screenshot &amp; Annotation Chrome Extension" />
51    <meta name="twitter:description" content="Lossless full page scrolling capture, smart sticky header suppression, 14 vector tools, 60 FPS screen recorder, and 100% private IndexedDB storage. Created by Sarangan Raviraj &amp; Sahana Ravichandran." />
52    <meta name="twitter:image" content="https://clicksnap.live/store-assets/marquee-promo-1400x560.png" />
53    <meta name="twitter:image:alt" content="ClickSnap Chrome Extension Marquee Banner" />
54    <meta name="twitter:site" content="@RavirajSarangan" />
55    <meta name="twitter:creator" content="@RavirajSarangan" />
56
57    <!-- AEO (Answer Engine Optimization) & Semantic Crawler Directives -->
58    <meta name="ai-content-declaration" content="human-crafted-software" />
59    <meta name="robots" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />
60
61    <!-- Schema.org JSON-LD Structured Data (SoftwareApplication, WebSite, FAQPage, HowTo, Organization) -->
62    
62<script type="application/ld+json">
63      {
64        "@context": "https://schema.org",
65        "@graph": [
66          {
67            "@type": "WebSite",
68            "@id": "https://clicksnap.live/#website",
69            "url": "https://clicksnap.live",
70            "name": "ClickSnap",
71            "description": "Full-Page Screenshot, Screen & GIF Recorder, and Visual Annotation Chrome Extension with 100% Client-Side Privacy",
72            "publisher": {
73              "@id": "https://clicksnap.live/#organization"
74            },
75            "potentialAction": {
76              "@type": "SearchAction",
77              "target": {
78                "@type": "EntryPoint",
79                "urlTemplate": "https://clicksnap.live/blog?q={search_term_string}"
80              },
81              "query-input": "required name=search_term_string"
82            }
83          },
84          {
85            "@type": "SoftwareApplication",
86            "@id": "https://clicksnap.live/#software",
87            "name": "ClickSnap",
88            "operatingSystem": "Google Chrome, Microsoft Edge, Brave, Chromium, macOS, Windows, Linux, ChromeOS",
89            "applicationCategory": ["DesignApplication", "MultimediaApplication", "UtilitiesApplication"],
90            "softwareVersion": "1.0.1",
91            "installUrl": "https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb",
92            "downloadUrl": "https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb",
93            "screenshot": [
94              "https://clicksnap.live/store-assets/screenshot-1-editor.png",
95              "https://clicksnap.live/store-assets/screenshot-2-popup.png",
96              "https://clicksnap.live/store-assets/screenshot-3-framing.png",
97              "https://clicksnap.live/store-assets/screenshot-4-redaction.png",
98              "https://clicksnap.live/store-assets/screenshot-5-library.png"
99            ],
100            "featureList": [
101              "Lossless Full-Page Scrolling Capture with Smart Sticky Header Suppression",
102              "14 Vector Annotation Tools (Arrows, Step Badges, Typography, Shapes)",
103              "Screen & 60 FPS Animated GIF Recorder with Audio & In-Browser Trimming",
104              "100% Offline WASM OCR Text Grabber (Zero Cloud API Dependency)",
105              "AI Privacy Shield Auto-Redactor for API Keys, Tokens, and Credentials",
106              "Photorealistic 3D Device Framing & Social Mesh Gradient Studio",
107              "Floating Reference Pin-to-Screen & Live Eyedropper Color Palette Extractor",
108              "100% Client-Side Local IndexedDB Storage with Zero Cloud Leaks"
109            ],
110            "offers": {
111              "@type": "Offer",
112              "price": "0",
113              "priceCurrency": "USD",
114              "availability": "https://schema.org/InStock"
115            },
116            "creator": [
117              {
118                "@type": "Person",
119                "name": "Sarangan Raviraj",
120                "jobTitle": "Lead Extension Architect & Founder",
121                "url": "https://www.saranganraviraj.com/",
122                "sameAs": [
123                  "https://www.saranganraviraj.com/",
124                  "https://github.com/RavirajSarangan"
125                ]
126              },
127              {
128                "@type": "Person",
129                "name": "Sahana Ravichandran",
130                "jobTitle": "Product & UX Engineer",
131                "url": "https://sahanaravichandran.me/",
132                "sameAs": [
133                  "https://sahanaravichandran.me/"
134                ]
135              }
136            ],
137            "publisher": {
138              "@id": "https://clicksnap.live/#organization"
139            },
140            "description": "High-performance full-page screenshot, screen recording, and visual annotation Chrome extension with 100% client-side privacy, smart sticky header suppression, and gradient mockup frames."
141          },
142          {
143            "@type": "Organization",
144            "@id": "https://clicksnap.live/#organization",
145            "name": "ClickSnap",
146            "url": "https://clicksnap.live",
147            "logo": "https://clicksnap.live/icons/logo.png",
148            "sameAs": [
149              "https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb",
150              "https://www.saranganraviraj.com/",
151              "https://sahanaravichandran.me/"
152            ],
153            "founders": [
154              {
155                "@type": "Person",
156                "name": "Sarangan Raviraj",
157                "url": "https://www.saranganraviraj.com/"
158              },
159              {
160                "@type": "Person",
161                "name": "Sahana Ravichandran",
162                "url": "https://sahanaravichandran.me/"
163              }
164            ]
165          },
166          {
167            "@type": "HowTo",
168            "@id": "https://clicksnap.live/#howto",
169            "name": "How to Take a Full Page Screenshot in Google Chrome (Without Duplicate Sticky Headers)",
170            "description": "Learn how to capture an entire scrolling webpage in Chrome from top to bottom with zero broken headers using ClickSnap.",
171            "totalTime": "PT10S",
172            "step": [
173              {
174                "@type": "HowToStep",
175                "position": 1,
176                "name": "Install ClickSnap Extension",
177                "text": "Add ClickSnap to your Google Chrome browser from the Chrome Web Store.",
178                "url": "https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb"
179              },
180              {
181                "@type": "HowToStep",
182                "position": 2,
183                "name": "Trigger Full Page Capture",
184                "text": "Press Cmd+Shift+F on macOS or Ctrl+Shift+F on Windows. ClickSnap automatically suppresses floating headers and scrolls the page.",
185                "url": "https://clicksnap.live/docs"
186              },
187              {
188                "@type": "HowToStep",
189                "position": 3,
190                "name": "Annotate & Export",
191                "text": "Use the integrated 14-tool annotation studio to draw arrows, blur sensitive API keys, add gradient frames, and export in 2x Retina PNG or WebP.",
192                "url": "https://clicksnap.live/studio"
193              }
194            ]
195          },
196          {
197            "@type": "FAQPage",
198            "@id": "https://clicksnap.live/#faq",
199            "mainEntity": [
200              {
201                "@type": "Question",
202                "name": "What makes ClickSnap different from other full-page screenshot Chrome extensions?",
203                "acceptedAnswer": {
204                  "@type": "Answer",
205                  "text": "ClickSnap uses intelligent sticky header suppression that eliminates duplicate floating navbars during full page scroll captures. It includes 14 vector annotation tools, blur redaction shaders, social gradient framing, 60 FPS GIF recorder, offline OCR text grabber, and 100% offline local IndexedDB storage for free."
206                }
207              },
208              {
209                "@type": "Question",
210                "name": "How does ClickSnap full-page capture handle sticky headers and floating navbars?",
211                "acceptedAnswer": {
212                  "@type": "Answer",
213                  "text": "ClickSnap's intelligent DOM inspection temporarily hides fixed, sticky, and absolute position elements during sub-pixel scrolling slices, stitching a seamless 100% pixel-perfect image without duplicate headers."
214                }
215              },
216              {
217                "@type": "Question",
218                "name": "Can ClickSnap record screen video and convert to animated GIF?",
219                "acceptedAnswer": {
220                  "@type": "Answer",
221                  "text": "Yes. ClickSnap features a built-in 60 FPS hardware-accelerated Screen & Animated GIF Recorder with audio capture, in-browser start/end cut points, speed control (0.5x to 2x), and local IndexedDB video serving."
222                }
223              },
224              {
225                "@type": "Question",
226                "name": "Does ClickSnap support offline OCR text extraction and automatic privacy redaction?",
227                "acceptedAnswer": {
228                  "@type": "Answer",
229                  "text": "Yes. ClickSnap features 100% offline WebAssembly OCR to grab text directly from screenshots without cloud servers, plus an AI Privacy Shield that automatically detects and blurs API keys, tokens, emails, and credentials."
230                }
231              },
232              {
233                "@type": "Question",
234                "name": "Are my screenshots uploaded to cloud servers or third-party AI models?",
235                "acceptedAnswer": {
236                  "@type": "Answer",
237                  "text": "No. ClickSnap operates with a strict 100% client-side privacy architecture. All image stitching, canvas annotations, video recordings, and history retention happen locally in your browser's IndexedDB."
238                }
239              },
240              {
241                "@type": "Question",
242                "name": "How much does ClickSnap cost?",
243                "acceptedAnswer": {
244                  "@type": "Answer",
245                  "text": "ClickSnap is 100% free with zero mandatory accounts, zero paywalled tools, and zero monthly subscriptions."
246                }
247              },
248              {
249                "@type": "Question",
250                "name": "Who developed ClickSnap?",
251                "acceptedAnswer": {
252                  "@type": "Answer",
253                  "text": "ClickSnap was designed, crafted, and engineered by Sarangan Raviraj (Lead Extension Architect & Founder) and Sahana Ravichandran (Product & UX Engineer)."
254                }
255              }
256            ]
257          }
258        ]
259      }
260    </script>
260
261    
262    <!-- Google Fonts: Newsreader (Editorial Serif), Plus Jakarta Sans, JetBrains Mono -->
263    <link rel="preconnect" href="https://fonts.googleapis.com" />
264    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
265    <link
266      href="https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300..700;1,6..72,300..700&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap"
267      rel="stylesheet"
268    />
269
270    <!-- Icons & Favicon -->
271    <link rel="icon" type="image/png" sizes="32x32" href="/icons/icon32.png" />
272    <link rel="icon" type="image/png" sizes="16x16" href="/icons/icon16.png" />
273    <link rel="apple-touch-icon" sizes="128x128" href="/icons/icon128.png" />
274    <link rel="shortcut icon" href="/icons/icon32.png" />
275    
275<script type="module" crossorigin src="/assets/main-BqJOUdXS.js"></script>
275
276    <link rel="modulepreload" crossorigin href="/assets/index-D_fqDFOU.js">
277    <link rel="modulepreload" crossorigin href="/assets/x-B_aW8mdc.js">
278    <link rel="modulepreload" crossorigin href="/assets/Footer-C47heXbp.js">
279    <link rel="modulepreload" crossorigin href="/assets/Navbar-CFvfU4kP.js">
280    <link rel="modulepreload" crossorigin href="/assets/Picture-DpQGQBmM.js">
281    <link rel="modulepreload" crossorigin href="/assets/sparkles-CMpj34Q7.js">
282    <link rel="modulepreload" crossorigin href="/assets/camera-Bn_Ociyx.js">
283    <link rel="modulepreload" crossorigin href="/assets/zap-3tAyJTO7.js">
284    <link rel="modulepreload" crossorigin href="/assets/arrow-right-CglzBgsN.js">
285    <link rel="modulepreload" crossorigin href="/assets/circle-check-C5FxUN91.js">
286    <link rel="modulepreload" crossorigin href="/assets/image-exporter-BGYX-hM_.js">
287    <link rel="modulepreload" crossorigin href="/assets/type-Bxuy5-0s.js">
288    <link rel="modulepreload" crossorigin href="/assets/square-B428LTMu.js">
289    <link rel="modulepreload" crossorigin href="/assets/check-C1-OS8at.js">
290    <link rel="modulepreload" crossorigin href="/assets/copy-BwZQVjiw.js">
291    <link rel="modulepreload" crossorigin href="/assets/download-DVINsbZz.js">
292    <link rel="modulepreload" crossorigin href="/assets/smartphone-VMZEZYx2.js">
293    <link rel="modulepreload" crossorigin href="/assets/shield-check-B90UwLFZ.js">
294    <link rel="modulepreload" crossorigin href="/assets/video-Bjs6Mpie.js">
295    <link rel="modulepreload" crossorigin href="/assets/globe-DFf4WyfR.js">
296    <link rel="modulepreload" crossorigin href="/assets/lock-W6iQ3l_J.js">
297    <link rel="modulepreload" crossorigin href="/assets/layers-DQsvcV7Y.js">
298    <link rel="modulepreload" crossorigin href="/assets/reviewsData-DAMb4c-_.js">
299    <link rel="modulepreload" crossorigin href="/assets/star-DGANtZQM.js">
300    <link rel="modulepreload" crossorigin href="/assets/chevron-down-BsZ2iqJ8.js">
301    <link rel="stylesheet" crossorigin href="/assets/index-B4xhsohB.css">
302  </head>
303  <body class="bg-slate-50 text-slate-900 font-sans antialiased overflow-x-hidden">
304    <div id="root"><div class="min-h-screen bg-white text-gray-900 font-sans selection:bg-gray-900 selection:text-white flex flex-col antialiased"><nav class="fixed top-0 left-0 right-0 z-50 transition-all duration-300 bg-white/80 backdrop-blur-sm border-b border-gray-100/60 py-3.5"><div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center justify-between"><a href="/" class="flex items-center gap-2.5 group cursor-pointer transition-transform active:scale-95 shrink-0 mr-4 sm:mr-6" title="ClickSnap Home"><img src="/icons/logo.png" alt="ClickSnap Logo" class="w-8 h-8 sm:w-9 sm:h-9 object-contain group-hover:scale-105 transition-transform shrink-0"/><div class="flex items-center gap-2"><span class="font-semibold text-xl text-gray-900 tracking-tight leading-none group-hover:text-gray-700 transition-colors whitespace-nowrap">ClickSnap</span><span class="text-[10px] font-mono font-medium text-gray-500 bg-gray-100 border border-gray-200 px-1.5 py-0.5 rounded-md whitespace-nowrap">v1.0</span></div></a><div class="hidden lg:flex items-center gap-6 xl:gap-7 text-sm font-medium text-gray-600 whitespace-nowrap"><a href="/#features" class="hover:text-gray-900 transition-colors cursor-pointer whitespace-nowrap">Features</a><a href="/#interactive-demo" class="hover:text-gray-900 transition-colors flex items-center gap-1.5 cursor-pointer whitespace-nowrap"><span>Live Studio</span></a><a href="/comparison" class="hover:text-gray-900 transition-colors whitespace-nowrap">Comparison</a><a href="/blog" class="hover:text-gray-900 transition-colors whitespace-nowrap">Blog</a><a href="/reviews" class="hover:text-gray-900 transition-colors whitespace-nowrap">Reviews</a><a href="/docs" class="hover:text-gray-900 transition-colors whitespace-nowrap">Docs</a><a href="/#faq" class="hover:text-gray-900 transition-colors cursor-pointer whitespace-nowrap">FAQ</a></div><div class="hidden sm:flex items-center gap-2.5 shrink-0 ml-4"><button type="button" class="text-xs font-medium text-gray-700 hover:text-gray-900 px-3 py-1.5 rounded-xl border border-gray-200 hover:bg-gray-50 transition-all whitespace-nowrap cursor-pointer">Web Studio</button><button type="button" class="flex items-center space-x-2 rounded-xl px-3.5 py-1.5 text-white transition-all duration-300 hover:-translate-y-0.5 hover:shadow-xl will-change-transform bg-gray-900 hover:bg-black font-medium text-xs shadow-sm whitespace-nowrap cursor-pointer"><svg class="w-3.5 h-3.5 shrink-0" width="20" height="20" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24 12H44.78A24 24 0 0 0 3.22 12L13.61 30A12 12 0 0 1 24 12Z" fill="#EA4335"></path><path d="M34.39 30L24 48A24 24 0 0 0 44.78 12H24A12 12 0 0 1 34.39 30Z" fill="#FBBC05"></path><path d="M13.61 30L3.22 12A24 24 0 0 0 24 48L34.39 30A12 12 0 0 1 13.61 30Z" fill="#34A853"></path><circle cx="24" cy="24" r="12" fill="#FFFFFF"></circle><circle cx="24" cy="24" r="9.5" fill="#4285F4"></circle></svg><span>Add to Chrome — Free</span></button></div><button class="lg:hidden p-2 text-gray-600 hover:text-gray-900 rounded-xl hover:bg-gray-100 cursor-pointer" aria-label="Toggle navigation menu"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-menu w-5 h-5"><line x1="4" x2="20" y1="12" y2="12"></line><line x1="4" x2="20" y1="6" y2="6"></line><line x1="4" x2="20" y1="18" y2="18"></line></svg></button></div></nav><main class="flex-1"><section class="relative pt-24 sm:pt-32 pb-14 sm:pb-20 bg-white"><div class="max-w-4xl mx-auto px-4 sm:px-6 text-center flex flex-col items-center"><div class="inline-flex antialiased relative justify-center mb-6 sm:mb-8"><div class="flex items-center gap-2 bg-white border border-gray-200 rounded-full px-3 py-1 shadow-xs whitespace-nowrap"><div class="relative flex items-center shrink-0"><span class="w-1.5 h-1.5 rounded-full bg-emerald-500"></span><span class="absolute w-1.5 h-1.5 rounded-full bg-emerald-400 animate-ping-slow"></span></div><span class="text-[11px] font-semibold text-gray-900">v1.0.1 Studio Released</span></div></div><h1 class="mx-auto w-full max-w-3xl text-balance text-center text-3xl font-semibold !leading-[1.2] tracking-tight text-neutral-900 sm:text-5xl md:text-6xl">Capture entire web pages. <span class="highlight font-semibold text-gray-900">Edit &amp; share like a pro.</span></h1><p class="mx-auto mt-5 sm:mt-6 max-w-2xl text-balance text-center text-sm leading-6 text-gray-600 sm:text-base sm:leading-7 font-normal">Flawless full-page scrolling captures with zero duplicate headers. Annotate with step counters and privacy blur, wrap in viral social mockups, and paste anywhere in seconds.</p><div class="flex flex-col sm:flex-row items-center justify-center gap-3 mt-8 sm:mt-9 w-full sm:w-auto"><a href="https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb" target="_blank" rel="noreferrer" class="flex w-full sm:w-auto items-center justify-center space-x-2 rounded-xl px-5 py-3 text-white transition-all duration-300 hover:-translate-y-0.5 hover:shadow-xl will-change-transform bg-gray-900 hover:bg-black font-semibold text-sm shadow-sm"><svg class="w-4 h-4 shrink-0" width="20" height="20" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24 12H44.78A24 24 0 0 0 3.22 12L13.61 30A12 12 0 0 1 24 12Z" fill="#EA4335"></path><path d="M34.39 30L24 48A24 24 0 0 0 44.78 12H24A12 12 0 0 1 34.39 30Z" fill="#FBBC05"></path><path d="M13.61 30L3.22 12A24 24 0 0 0 24 48L34.39 30A12 12 0 0 1 13.61 30Z" fill="#34A853"></path><circle cx="24" cy="24" r="12" fill="#FFFFFF"></circle><circle cx="24" cy="24" r="9.5" fill="#4285F4"></circle></svg><span>Add to Chrome — Free Forever</span></a><button type="button" class="flex w-full sm:w-auto items-center justify-center space-x-2 rounded-xl px-5 py-3 text-gray-800 bg-white border border-gray-200 hover:bg-gray-50 transition-all font-semibold text-sm shadow-xs hover:border-gray-300"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles w-4 h-4 text-indigo-600"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg><span>Try Live Web Studio</span></button></div><p class="mt-3.5 text-xs text-gray-500 font-medium">✓ 100% Free Forever • Zero Data Tracking • No Sign-Up Required</p><div class="mt-12 sm:mt-16 w-full max-w-4xl group rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="rounded-xl border border-gray-100 bg-gray-50 p-3 sm:p-5 transition-all"><div class="h-8 bg-white rounded-lg border border-gray-200 px-3 flex items-center justify-between shadow-2xs mb-3"><div class="flex items-center gap-1.5"><div class="w-2.5 h-2.5 rounded-full bg-rose-400"></div><div class="w-2.5 h-2.5 rounded-full bg-amber-400"></div><div class="w-2.5 h-2.5 rounded-full bg-emerald-400"></div><span class="text-[11px] text-gray-400 font-mono ml-2">clicksnap.live</span></div></div><div class="relative rounded-xl overflow-hidden border border-gray-200/80 shadow-md bg-white group-hover:shadow-lg transition-all duration-300"><picture style="display:contents"><source srcSet="/store-assets/screenshot-1-editor.webp" type="image/webp"/><img src="/store-assets/screenshot-1-editor.png" alt="ClickSnap Full-Page Screenshot &amp; Visual Annotation Studio" width="1280" height="800" class="w-full h-auto object-cover rounded-xl" loading="eager" decoding="async"/></picture></div></div></div></div></section><section id="how-it-works" class="py-16 sm:py-24 bg-white border-t border-gray-100"><div class="max-w-5xl mx-auto px-4 sm:px-6"><div class="text-center max-w-2xl mx-auto mb-12 sm:mb-16"><div class="inline-flex antialiased relative justify-center mb-4"><div class="flex items-center gap-2 bg-white border border-gray-200 rounded-full px-3.5 py-1.5 
304shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles w-3.5 h-3.5 text-amber-500"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg><span class="text-xs font-semibold text-gray-900">3 Simple Steps • Fast &amp; Private</span></div></div><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">How to take a full page screenshot in Chrome <span class="highlight font-semibold text-gray-900">in 3 seconds</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">Capturing flawless scrolling webpages without broken sticky headers has never been easier. No signups, no watermarks, no server uploads.</p></div><div class="grid grid-cols-1 md:grid-cols-3 gap-3 sm:gap-4"><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><span class="font-mono text-2xl font-bold text-gray-900 tracking-tight">01</span><span class="text-[10px] font-semibold text-gray-700 bg-white border border-gray-200 px-2 py-0.5 rounded-full shadow-2xs">Free Forever</span></div><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-gray-900 flex items-center justify-center shadow-2xs mt-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-cloud-download w-5 h-5"><path d="M12 13v8l-4-4"></path><path d="m12 21 4-4"></path><path d="M4.393 15.269A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.436 8.284"></path></svg></div><h3 class="text-base font-semibold text-gray-900 tracking-tight">Install the Free Chrome Extension</h3><p class="text-xs text-gray-600 leading-relaxed font-normal">Add ClickSnap to your browser in one click from the official Chrome Web Store. Zero account creation required.</p></div><div class="pt-3 border-t border-gray-200/60 mt-2"><a href="https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb" target="_blank" rel="noreferrer" class="flex items-center justify-between text-xs font-semibold text-gray-900 hover:text-black group/link"><span>Add to Chrome</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right w-3.5 h-3.5 group-hover/link:translate-x-0.5 transition-transform"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a></div></div></div><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><span class="font-mono text-2xl font-bold text-gray-900 tracking-tight">02</span><span class="text-[10px] font-semibold text-gray-700 bg-white border border-gray-200 px-2 py-0.5 rounded-full shadow-2xs">Sticky Suppression</span></div><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-gray-900 flex items-center justify-center shadow-2xs mt-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-camera w-
3045 h-5"><path d="M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z"></path><circle cx="12" cy="13" r="3"></circle></svg></div><h3 class="text-base font-semibold text-gray-900 tracking-tight">Press Ctrl+Shift+F to Capture Full Page</h3><p class="text-xs text-gray-600 leading-relaxed font-normal">ClickSnap automatically suppresses repeating floating navbars, scrolls down the DOM, and captures sub-pixel slices with zero seams.</p></div><div class="pt-3 border-t border-gray-200/60 mt-2"><div class="flex items-center justify-between text-xs"><span class="text-gray-500 font-medium">Instant Trigger:</span><span class="font-mono text-xs font-bold text-gray-900 bg-white border border-gray-200 px-2 py-0.5 rounded shadow-2xs">Ctrl+Shift+F</span></div></div></div></div><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><span class="font-mono text-2xl font-bold text-gray-900 tracking-tight">03</span><span class="text-[10px] font-semibold text-gray-700 bg-white border border-gray-200 px-2 py-0.5 rounded-full shadow-2xs">14 Vector Tools</span></div><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-gray-900 flex items-center justify-center shadow-2xs mt-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette w-5 h-5"><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z"></path></svg></div><h3 class="text-base font-semibold text-gray-900 tracking-tight">Annotate, Redact &amp; Export in 2× Retina</h3><p class="text-xs text-gray-600 leading-relaxed font-normal">Draw vector arrows, stamp numbered steps, blur sensitive tokens, add gradient social frames, and copy directly to clipboard.</p></div><div class="pt-3 border-t border-gray-200/60 mt-2"><a href="/studio" target="_self" class="flex items-center justify-between text-xs font-semibold text-gray-900 hover:text-black group/link"><span>Try Studio Online</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right w-3.5 h-3.5 group-hover/link:translate-x-0.5 transition-transform"><path d="M5 12h14"></path><path d="m12 5 7 7-7 7"></path></svg></a></div></div></div></div><div class="mt-8 group rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="rounded-xl border border-gray-100 bg-gray-50 p-5 sm:p-6 flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4"><div class="flex flex-col gap-1 max-w-2xl"><div class="flex items-center gap-1.5 text-xs font-semibold text-gray-900"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Google Featured Snippet / Quick Answer:</span></div><p class="text-xs text-gray-600 leading-relaxed">To capture a full scrolling page in Google Chrome: install <strong>ClickSnap</strong>, open the page you want to capture, and press <strong>Cmd+Shift+F</strong> (macOS) or <strong>Ctrl+Shift+F</strong> (Windows). ClickSnap suppresses sticky headers, stitches the full document in sub-pixel resolution, and opens the studio for instant annotation and export.</p></div><a href="https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb" target="_blank" rel="noreferrer" class="px-4 py-2 rounded-xl text-xs font-semibold text-white bg-gray-900 hover:bg-black transition-all shadow-sm shrink-0">Add to Chrome — Free</a></div></div></div></section><section id="interactive-demo" class="py-16 sm:py-20 bg-white border-t border-gray-100"><div class="max-w-5xl mx-auto px-4 sm:px-6"><div class="text-center max-w-2xl mx-auto mb-10 sm:mb-12"><span class="mb-3 block text-base font-medium tracking-normal text-gray-500 sm:text-lg">Try it yourself right here...</span><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Interactive visual canvas &amp; <span class="highlight font-semibold text-gray-900">annotation studio</span></h2><p class="mx-auto mt-4 max-w-lg text-sm text-gray-600 leading-relaxed font-normal">Draw smooth vector arrows, stamp numbered workflow steps, blur sensitive tokens, and customize social frame gradients in real-time.</p></div><div class="max-w-4xl mx-auto group rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="rounded-xl border border-gray-100 bg-gray-50 p-3 sm:p-5 flex flex-col gap-4"><div class="flex flex-col sm:flex-row items-stretch sm:items-center justify-between gap-3 pb-3 border-b border-gray-200/80"><div class="flex items-center gap-1 bg-white p-1 rounded-xl border border-gray-200 shadow-2xs overflow-x-auto no-scrollbar"><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 bg-gray-900 text-white shadow-xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-up-right w-3.5 h-3.5"><path d="M7 7h10v10"></path><path d="M7 17 17 7"></path></svg><span>Arrow</span></button><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 text-gray-600 hover:text-gray-900 hover:bg-gray-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-list-ordered w-3.5 h-3.5"><path d="M10 12h11"></path><path d="M10 18h11"></path><path d="M10 6h11"></path><path d="M4 10h2"></path><path d="M4 6h1v4"></path><path d="M6 18H4c0-1 2-2 2-3s-1-1.5-2-1"></path></svg><span>Step</span></button><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 text-gray-600 hover:text-gray-900 hover:bg-gray-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-type w-3.5 h-3.5"><polyline points="4 7 4 4 20 4 20 7"></polyline><line x1="9" x2="15" y1="20" y2="20"></line><line x1="12" x2="12" y1="4" y2="20"></line></svg><span>Text</span></button><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 text-gray-600 hover:text-gray-900 hover:bg-gray-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-droplets w-3.5 h-3.5"><path d="M7 16.3c2.2 0 4-1.83 4-4.05 0-1.16-.57-2.26-1.71-3.19S7.29 6.75 7 5.3c-.29 1.45-1.14 2.84-2.29 3.76S3 11.1 3 12.25c0 2.22 1.8 4.05 4 4.05z"></path><path d="M12.56 6.6A10.97 10.97 0 0 0 14 3.02c.5 2.5 2 4.9 4 6.5s3 3.5 3 5.5a6.98 6.98 0 0 1-11.91 4.97"></path></svg><span>Blur</span></button><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 text-gray-600 hover:text-gray-900 hover:bg-gray-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil w-3.5 h-3.5"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path><path d="m15 5 4 4"></path></svg><span>Pen</span></button><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 text-gray-600 hover:text-gray-900 hover:bg-gray-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-highlighter w-3.5 h-3.5"><path d="m9 11-6 6v3h9l3-3"></path><path d="m22 12-4.6 4.6a2 2 0 0 1-2.8 0l-5.2-5.2a2 2 0 0 1 0-2.8L14 4"></path></svg><span>Highlight</span></button><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 text-gray-600 hover:text-gray-900 hover:bg-gray-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-square w-3.5 h-3.5"><rect width="18" height="18" x="3" y="3" rx="2"></rect></svg><span>Rect</span></button><button type="button" class="px-2.5 py-1.5 rounded-lg text-xs font-medium flex items-center gap-1.5 transition-all shrink-0 text-gray-600 hover:text-gray-900 hover:bg-gray-100"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle w-3.5 h-3.5"><circle cx="12" cy="12" r="10"></circle></svg><span>Circle</span></button></div><div class="flex items-center justify-between sm:justify-end gap-2 shrink-0"><span class="text-xs text-gray-500 font-medium hidden xs:inline">Frame:</span><div class="flex items-center gap-1.5 bg-white p-1 rounded-xl border border-gray-200 shadow-2xs"><button type="button" class="w-5 h-5 sm:w-6 sm:h-6 rounded-md border transition-all ring-2 ring-gray-900 scale-110" style="background:linear-gradient(135deg, #2563EB, #7C3AED)" title="Hyper Violet"></button><button type="button" class="w-5 h-5 sm:w-6 sm:h-6 rounded-md border transition-all border-gray-200 hover:scale-105" style="background:linear-gradient(135deg, #7C3AED, #EC4899)" title="Purple Velvet"></button><button type="button" class="w-5 h-5 sm:w-6 sm:h-6 rounded-md border transition-all border-gray-200 hover:scale-105" style="background:linear-gradient(135deg, #F43F5E, #FB923C)" title="Sunset Glow"></button><button type="button" class="w-5 h-5 sm:w-6 sm:h-6 rounded-md border transition-all border-gray-200 hover:scale-105" style="background:linear-gradient(135deg, #10B981, #06B6D4)" title="Emerald Mesh"></button><button type="button" class="w-5 h-5 sm:w-6 sm:h-6 rounded-md border transition-all border-gray-200 hover:scale-105" style="background:linear-gradient(135deg, #0F172A, #334155)" title="Midnight Dark"></button></div><button type="button" title="Clear Canvas" class="p-1.5 text-gray-500 hover:text-rose-600 hover:bg-gray-100 rounded-lg transition-colors ml-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-rotate-ccw w-4 h-4"><path d="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"></path><path d="M3 3v5h5"></path></svg></button></div></div><div style="background:linear-gradient(135deg, #2563EB, #7C3AED)" class="p-3 sm:p-8 rounded-xl flex items-center justify-center transition-all duration-300 shadow-inner overflow-x-auto"><div class="rounded-lg overflow-hidden shadow-xl border border-white/20 bg-white cursor-crosshair max-w-full"><canvas class="block w-full max-w-[850px] h-auto object-contain"></canvas></div></div><div class="flex flex-col sm:flex-row items-center justify-between gap-3 pt-1 text-xs text-gray-500 text-center sm:text-left"><span>💡 Click and drag directly on the canvas above to draw live annotations.</span><div class="flex items-center gap-2 w-full sm:w-auto justify-center sm:justify-end"><button type="button" class="flex items-center justify-center space-x-1.5 rounded-xl px-3.5 py-1.5 text-gray-700 bg-white border border-gray-200 hover:bg-gray-100 transition-all font-medium text-xs shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy w-3.5 h-3.5"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"></rect><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"></path></svg><span>Copy</span></button><button type="button" class="flex items-center justify-center space-x-1.5 rounded-xl px-3.5 py-1.5 text-white bg-gray-900 hover:bg-black transition-all font-semibold text-xs shadow-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-download w-3.5 h-3.5"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" x2="12" y1="15" y2="3"></line></svg><span>Download PNG</span></button></div></div></div></div></div></section><section id="features" class="py-16 sm:py-24 bg-white border-t border-gray-100"><div class="max-w-5xl mx-auto px-4 sm:px-6 flex flex-col gap-16 sm:gap-24"><div><div class="text-center max-w-2xl mx-auto"><div class="inline-flex items-center gap-1.5 px-3 py-1 rounded-full bg-blue-50 border border-blue-100/80 text-blue-700 text-xs font-semibold mb-3 shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles w-3.5 h-3.5 text-amber-500"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg><span>New in ClickSnap Studio v1.0.1</span></div><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Client-Side AI Studio &amp; <span class="highlight font-semibold text-gray-900">Motion Capture</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">Extract text with local OCR, auto-redact secrets with AI Privacy Shield, record animated GIFs, and wrap captures in photorealistic 3D device shells.</p></div><div class="grid grid-cols-1 md:grid-cols-3 gap-4 mt-10 sm:mt-12"><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-blue-300 transition-all duration-200">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 bg-gray-50 border border-gray-100"><div class="flex items-center justify-between"><div class="flex items-center gap-2.5"><div class="w-9 h-9 rounded-xl bg-white border border-gray-200 text-blue-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-scan-text w-4 h-4"><path d="M3 7V5a2 2 0 0 1 2-2h2"></path><path d="M17 3h2a2 2 0 0 1 2 2v2"></path><path d="M21 17v2a2 2 0 0 1-2 2h-2"></path><path d="M7 21H5a2 2 0 0 1-2-2v-2"></path><path d="M7 8h8"></path><path d="M7 12h10"></path><path d="M7 16h6"></path></svg></div><div><h3 class="text-sm font-semibold text-gray-900">Offline OCR Grabber</h3><p class="text-[11px] text-gray-500">1-Click Text &amp; Code Copy</p></div></div><span class="text-[10px] font-mono font-bold text-blue-700 bg-blue-100/80 px-2 py-0.5 rounded-full">WASM</span></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/feature-ocr-preview.webp" type="image/webp"/><img src="/store-assets/feature-ocr-preview.png" alt="ClickSnap Offline OCR Text Grabber Studio" width="1376" height="768" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><p class="text-xs text-gray-600 leading-relaxed font-normal">Extract readable text, JSON payloads, and terminal code snippets directly from any screenshot without uploading to external cloud servers.</p><ul class="space-y-1.5 text-xs font-medium text-gray-700 pt-1 border-t border-gray-100"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>100% Client-Side WebAssembly</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Syntax &amp; indentation preservation</span></li></ul></div></div><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-emerald-300 transition-all duration-200"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 bg-gray-50 border border-gray-100"><div class="flex items-center justify-between"><div class="flex items-center gap-2.5"><div class="w-9 h-9 rounded-xl bg-white border border-gray-200 text-emerald-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-4 h-4"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><div><h3 class="text-sm font-semibold text-gray-900">AI Privacy Shield</h3><p class="text-[11px] text-gray-500">1-Click Secret Redaction</p></div></div><span class="text-[10px] font-mono font-bold text-emerald-700 bg-emerald-100/80 px-2 py-0.5 rounded-full">Auto</span></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/feature-privacy-preview.webp" type="image/webp"/><img src="/store-assets/feature-privacy-preview.png" alt="ClickSnap AI Privacy Shield Auto-Redact" width="1376" height="768" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><p class="text-xs text-gray-600 leading-relaxed font-normal">Scan canvas and instantly blur API keys, JWT tokens, customer emails, IPv4 addresses, credit cards, and passwords with destructive shaders.</p><ul class="space-y-1.5 text-xs font-medium text-gray-700 pt-1 border-t border-gray-100"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Automated regex pattern scanning</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Dual Gaussian &amp; pixelate shaders</span></li></ul></div></div><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-purple-300 transition-all duration-200">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 bg-gray-50 border border-gray-100"><div class="flex items-center justify-between"><div class="flex items-center gap-2.5"><div class="w-9 h-9 rounded-xl bg-white border border-gray-200 text-purple-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-video w-4 h-4"><path d="m16 13 5.223 3.482a.5.5 0 0 0 .777-.416V7.87a.5.5 0 0 0-.752-.432L16 10.5"></path><rect x="2" y="6" width="14" height="12" rx="2"></rect></svg></div><div><h3 class="text-sm font-semibold text-gray-900">Screen &amp; GIF Recorder</h3><p class="text-[11px] text-gray-500">WebM &amp; Animated GIF</p></div></div><span class="text-[10px] font-mono font-bold text-purple-700 bg-purple-100/80 px-2 py-0.5 rounded-full">60 FPS</span></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/feature-recorder-preview.webp" type="image/webp"/><img src="/store-assets/feature-recorder-preview.png" alt="ClickSnap Screen Recorder and Device Framing" width="1376" height="768" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><p class="text-xs text-gray-600 leading-relaxed font-normal">Record browser tabs, windows, or micro-interactions directly into animated GIFs and WebM video clips for Jira bug reports and GitHub PRs.</p><ul class="space-y-1.5 text-xs font-medium text-gray-700 pt-1 border-t border-gray-100"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Zero watermark exports</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Direct animated GIF conversion</span></li></ul></div></div></div><div class="grid grid-cols-1 sm:grid-cols-3 gap-3.5 mt-4"><div class="p-3.5 rounded-xl bg-gray-50 border border-gray-200/70 flex items-center gap-3 shadow-2xs hover:border-gray-300 transition-colors"><div class="w-8 h-8 rounded-lg bg-indigo-100 text-indigo-700 flex items-center justify-center shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-smartphone w-4 h-4"><rect width="14" height="20" x="5" y="2" rx="2" ry="2"></rect><path d="M12 18h.01"></path></svg></div><div><span class="text-xs font-bold text-gray-900 block">3D macOS &amp; iPhone 15 Frames</span><span class="text-[11px] text-gray-500">Safari window and Dynamic Island shells</span></div></div><div class="p-3.5 rounded-xl bg-gray-50 border border-gray-200/70 flex items-center gap-3 shadow-2xs hover:border-gray-300 transition-colors"><div class="w-8 h-8 rounded-lg bg-amber-100 text-amber-700 flex items-center justify-center shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-palette w-4 h-4"><circle cx="13.5" cy="6.5" r=".5" fill="currentColor"></circle><circle cx="17.5" cy="10.5" r=".5" fill="currentColor"></circle><circle cx="8.5" cy="7.5" r=".5" fill="currentColor"></circle><circle cx="6.5" cy="12.5" r=".5" fill="currentColor"></circle><path d="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z"></path></svg></div><div><span class="text-xs font-bold text-gray-900 block">Loupe Eyedropper &amp; Palette</span><span class="text-[11px] text-gray-500">
3048x loupe with 5-stop color harmonies</span></div></div><div class="p-3.5 rounded-xl bg-gray-50 border border-gray-200/70 flex items-center gap-3 shadow-2xs hover:border-gray-300 transition-colors"><div class="w-8 h-8 rounded-lg bg-teal-100 text-teal-700 flex items-center justify-center shrink-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-maximize2 w-4 h-4"><polyline points="15 3 21 3 21 9"></polyline><polyline points="9 21 3 21 3 15"></polyline><line x1="21" x2="14" y1="3" y2="10"></line><line x1="3" x2="10" y1="21" y2="14"></line></svg></div><div><span class="text-xs font-bold text-gray-900 block">Floating Pin-to-Screen</span><span class="text-[11px] text-gray-500">Always-on-top Picture-in-Picture window</span></div></div></div></div><div><div class="text-center max-w-2xl mx-auto"><span class="mb-3 block text-base font-medium tracking-normal text-gray-500 sm:text-lg">Capture without limits...</span><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Automated Full-Page Stitching &amp; <span class="highlight font-semibold text-gray-900">Sticky Header Suppression</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">Say goodbye to repeated headers in your screenshots. ClickSnap detects and temporarily hides fixed navigation bars during scroll capture, reassembling pages seamlessly.</p></div><div class="grid grid-cols-12 gap-3 mt-10 sm:mt-12"><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm col-span-12 md:col-span-7 bg-white"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex items-center gap-3"><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-blue-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-globe w-5 h-5"><circle cx="12" cy="12" r="10"></circle><path d="M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20"></path><path d="M2 12h20"></path></svg></div><div><h3 class="text-base font-semibold text-gray-900">Sticky Header Suppression &amp; SPA Auto-Scroll</h3><p class="text-xs text-gray-500">Zero duplicate navbar slices on Gmail &amp; Notion</p></div></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/screenshot-2-popup.webp" type="image/webp"/><img src="/store-assets/screenshot-2-popup.png" alt="ClickSnap 1-Click Extension Popup" width="1280" height="800" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><ul class="flex flex-col gap-2 text-xs font-medium text-gray-700 pt-1"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Automatic fixed &amp; sticky header detection and restoration</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Sub-pixel overlap trimming on scroll boundaries</span></li></ul></div></div><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm col-span-12 md:col-span-5 bg-white">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex items-center gap-3"><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-indigo-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-zap w-5 h-5"><path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"></path></svg></div><div><h3 class="text-base font-semibold text-gray-900">Ultra-Fast Canvas Loop</h3><p class="text-xs text-gray-500">Memory-safe rendering</p></div></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/screenshot-1-editor.webp" type="image/webp"/><img src="/store-assets/screenshot-1-editor.png" alt="ClickSnap Ultra-Fast Studio Canvas" width="1280" height="800" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><ul class="flex flex-col gap-2 text-xs font-medium text-gray-700"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Real-time capture progress HUD</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Instant escape key cancel guard</span></li></ul></div></div></div></div><div><div class="text-center max-w-2xl mx-auto"><span class="mb-3 block text-base font-medium tracking-normal text-gray-500 sm:text-lg">Imagine if you could...</span><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Redact Sensitive Data <span class="highlight font-semibold text-gray-900">In One Click</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">Say goodbye to accidental leaks. Mask tokens, credit cards, emails, and passwords with adjustable pixelation before sharing.</p></div><div class="grid grid-cols-12 gap-3 mt-10 sm:mt-12"><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm col-span-12 md:col-span-5 bg-white"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex items-center gap-3"><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-rose-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-lock w-5 h-5"><rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg></div><div><h3 class="text-base font-semibold text-gray-900">Local IndexedDB Storage</h3><p class="text-xs text-gray-500">Zero server uploads</p></div></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/screenshot-5-library.webp" type="image/webp"/><img src="/store-assets/screenshot-5-library.png" alt="ClickSnap Local IndexedDB Library" width="1280" height="800" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><ul class="flex flex-col gap-2 text-xs font-medium text-gray-700"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Zero external API calls</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>100% private offline storage</span></li></ul></div></div><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm col-span-12 md:col-span-7 bg-white">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex items-center gap-3"><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-emerald-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-droplets w-5 h-5"><path d="M7 16.3c2.2 0 4-1.83 4-4.05 0-1.16-.57-2.26-1.71-3.19S7.29 6.75 7 5.3c-.29 1.45-1.14 2.84-2.29 3.76S3 11.1 3 12.25c0 2.22 1.8 4.05 4 4.05z"></path><path d="M12.56 6.6A10.97 10.97 0 0 0 14 3.02c.5 2.5 2 4.9 4 6.5s3 3.5 3 5.5a6.98 6.98 0 0 1-11.91 4.97"></path></svg></div><div><h3 class="text-base font-semibold text-gray-900">Dual Redaction Shaders</h3><p class="text-xs text-gray-500">Pixelate &amp; Gaussian Blur</p></div></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/screenshot-4-redaction.webp" type="image/webp"/><img src="/store-assets/screenshot-4-redaction.png" alt="ClickSnap Dual Redaction Shaders" width="1280" height="800" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><ul class="flex flex-col gap-2 text-xs font-medium text-gray-700 pt-1"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Adjustable brush blur and box pixelate</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Non-destructive undo/redo anytime</span></li></ul></div></div></div></div><div><div class="text-center max-w-2xl mx-auto"><span class="mb-3 block text-base font-medium tracking-normal text-gray-500 sm:text-lg">Close the loop, look professional...</span><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Social Mockup Studio &amp; <span class="highlight font-semibold text-gray-900">3D Device Shells</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">Transform raw screenshots into high-converting visuals for X, LinkedIn, Product Hunt, and documentation in seconds.</p></div><div class="grid grid-cols-12 gap-3 mt-10 sm:mt-12"><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm col-span-12 md:col-span-6 bg-white"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex items-center gap-3"><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-purple-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles w-5 h-5"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg></div><div><h3 class="text-base font-semibold text-gray-900">12 Mesh Gradients &amp; 3D Tilt</h3><p class="text-xs text-gray-500">Vibrant backdrop styling</p></div></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/screenshot-3-framing.webp" type="image/webp"/><img src="/store-assets/screenshot-3-framing.png" alt="ClickSnap Social Framing Studio" width="1280" height="800" class="w-full h-44 sm:h-52 object-cover object-top hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><ul class="flex flex-col gap-2 text-xs font-medium text-gray-700"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>
3043D macOS Safari Dark/Light &amp; iPhone 15 Pro shells</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Aspect ratio presets (16:9, 4:3, 1:1)</span></li></ul></div></div><div class="group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm col-span-12 md:col-span-6 bg-white"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-6 bg-gray-50 border border-gray-100 transition-colors duration-200 group-hover:border-gray-200"><div class="flex items-center gap-3"><div class="w-10 h-10 rounded-xl bg-white border border-gray-200 text-amber-600 flex items-center justify-center shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-layers w-5 h-5"><path d="m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z"></path><path d="m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65"></path><path d="m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65"></path></svg></div><div><h3 class="text-base font-semibold text-gray-900">2× Retina Ultra-HD Export</h3><p class="text-xs text-gray-500">PNG, JPEG, WebP, PDF &amp; Clipboard</p></div></div><div class="rounded-xl overflow-hidden border border-gray-200/80 shadow-2xs bg-white"><picture style="display:contents"><source srcSet="/store-assets/marquee-promo-1400x560.webp" type="image/webp"/><img src="/store-assets/marquee-promo-1400x560.png" alt="ClickSnap 2x Retina Export &amp; Marquee" width="1400" height="560" class="w-full h-44 sm:h-52 object-cover object-center hover:scale-102 transition-transform duration-300" loading="lazy" decoding="async"/></picture></div><ul class="flex flex-col gap-2 text-xs font-medium text-gray-700"><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Instant clipboard image copy</span></li><li class="flex items-center gap-2"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-circle-check w-3.5 h-3.5 text-emerald-600 shrink-0"><circle cx="12" cy="12" r="10"></circle><path d="m9 12 2 2 4-4"></path></svg><span>Lossless multi-format batch export</span></li></ul></div></div></div></div></div></section><section id="comparison" class="py-16 sm:py-24 bg-white border-t border-gray-100"><div class="max-w-5xl mx-auto px-4 sm:px-6"><div class="text-center max-w-2xl mx-auto mb-10 sm:mb-12"><span class="mb-3 block text-base font-medium tracking-normal text-gray-500 sm:text-lg">Start for free, never pay a subscription...</span><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Why creators and engineers <span class="highlight font-semibold text-gray-900">switch to ClickSnap</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">Stop paying $29/month SaaS subscriptions for basic screenshot features or dealing with buggy extensions that crash on long pages.</p></div><div class="max-w-4xl mx-auto group rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="rounded-xl border border-gray-100 bg-gray-50 p-3 sm:p-6 overflow-x-auto"><table class="w-full text-left border-collapse min-w-[520px]"><thead><tr class="border-b border-gray-200/80"><th class="py-3 px-3 text-xs font-semibold uppercase tracking-wider text-gray-500 w-2/5">Feature &amp; Capability</th><th class="py-3 px-3 text-center bg-white border border-gray-200 rounded-t-xl"><div class="flex items-center justify-center gap-1.5 font-semibold text-sm text-gray-900"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles w-3.5 h-3.5 text-amber-500"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg><span>ClickSnap</span></div><span class="text-[10px] text-emerald-600 font-semibold block">100% Free</span></th><th class="py-3 px-3 text-center text-xs font-semibold uppercase tracking-wider text-gray-400">Basic Tools</th><th class="py-3 px-3 text-center text-xs font-semibold uppercase tracking-wider text-gray-400">Paid SaaS ($29/mo)</th></tr></thead><tbody class="divide-y divide-gray-200/70 text-xs sm:text-sm"><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Full Page Scrolling Stitching</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><span>Partial / Buggy</span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-4 h-4 text-gray-500 mx-auto"><path d="M20 6 9 17l-5-5"></path></svg></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Sticky Header Suppression (Zero repeats)</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x w-4 h-4 text-gray-300 mx-auto"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><span>Limited</span></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Interactive Area Selection Overlay</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-4 h-4 text-gray-400 mx-auto"><path d="M20 6 9 17l-5-5"></path></svg></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-4 h-4 text-gray-500 mx-auto"><path d="M20 6 9 17l-5-5"></path></svg></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">14 Annotation Vector Tools (Arrows, Text, Steps)</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><span>Basic Pen Only</span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-4 h-4 text-gray-500 mx-auto"><path d="M20 6 9 17l-5-5"></path></svg></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Numbered Step Tutorial Badges (1, 2, 3...)</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x w-4 h-4 text-gray-300 mx-auto"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-4 h-4 text-gray-500 mx-auto"><path d="M20 6 9 17l-5-5"></path></svg></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Redact &amp; Blur (Brush + Pixelate)</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x w-4 h-4 text-gray-300 mx-auto"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-4 h-4 text-gray-500 mx-auto"><path d="M20 6 9 17l-5-5"></path></svg></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Social Mockup Framing (Gradients &amp; 3D Shadows)</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x w-4 h-4 text-gray-300 mx-auto"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><span>Paywall Add-on</span></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">100% Local &amp; Private (IndexedDB, Zero tracking)</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><span>Varies</span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x w-4 h-4 text-rose-400 mx-auto"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Chrome Manifest V3 Native + Side Panel</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-gray-900 text-white shadow-2xs"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-check w-3 h-3 stroke-[3]"><path d="M20 6 9 17l-5-5"></path></svg></span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x w-4 h-4 text-gray-300 mx-auto"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x w-4 h-4 text-rose-400 mx-auto
304"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg></td></tr><tr class="hover:bg-white/60 transition-colors"><td class="py-3 px-3 font-medium text-gray-800 text-xs sm:text-sm">Price</td><td class="py-3 px-3 text-center bg-white/80 border-x border-gray-200/80 font-semibold text-gray-900"><span class="font-bold text-gray-900 text-xs sm:text-sm">100% Free</span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><span>Free / Ads</span></td><td class="py-3 px-3 text-center text-gray-500 text-xs sm:text-sm"><span>$15 - $30 / mo</span></td></tr></tbody></table></div></div><div class="text-center mt-8 sm:mt-10"><a href="/comparison" class="inline-flex items-center justify-center gap-2 px-4 py-2 rounded-xl bg-white border border-gray-200 hover:bg-gray-50 text-gray-800 hover:text-gray-900 font-medium text-xs shadow-2xs hover:border-gray-300 transition-all"><span>View Complete Comparison Table</span><span class="text-gray-500">→</span></a></div></div></section><section id="reviews" class="py-16 sm:py-24 bg-white border-t border-gray-100 overflow-hidden relative"><div class="max-w-6xl mx-auto px-4 sm:px-6 mb-10 sm:mb-12"><div class="text-center max-w-2xl mx-auto"><span class="mb-3 block text-base font-medium tracking-normal text-gray-500 sm:text-lg">Loved by creators &amp; engineers...</span><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Built for people who <span class="highlight font-semibold text-gray-900">demand visual polish</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">See how creators, architects, and founders streamline visual communication and documentation with ClickSnap.</p></div></div><div class="relative w-full overflow-hidden py-2"><div class="pointer-events-none absolute inset-y-0 left-0 w-16 sm:w-32 bg-gradient-to-r from-white via-white/80 to-transparent z-10"></div><div class="pointer-events-none absolute inset-y-0 right-0 w-16 sm:w-32 bg-gradient-to-l from-white via-white/80 to-transparent z-10"></div><div class="animate-marquee-autorun flex gap-4 sm:gap-6 pl-4"><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md"><div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Design</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Every other scrolling tool leaves repeating headers in the middle of long responsive landing pages. ClickSnap temporarily hides fixed elements and produces completely seamless 100% pixel-perfect stitches with zero seams.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Alexandre Dubois</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Principal UX Architect • <span class="text-gray-700 font-medium">DesignScale</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Security</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Being able to blur API keys, tokens, and customer emails in one click directly inside Chrome before pasting screenshots into Jira has prevented massive compliance headaches for our engineering teams.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Priya Sharma</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Staff Platform Security Engineer • <span class="text-gray-700 font-medium">FinStack Core</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Founder</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;I use the mockup framing presets daily for feature announcements. The 135° mesh gradients and photorealistic 3D drop shadows look like a $100/hr designer built them in seconds.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Devon Vance</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Founder &amp; Builder • <span class="text-gray-700 font-medium">SaaSLaunch</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Productivity</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;The step annotation tool (1, 2, 3...) auto-increments with each click. Paired with curved arrows and typography badges, creating customer onboarding guides takes 30 seconds.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Marcus Brody</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Senior Product Reviewer • <span class="text-gray-700 font-medium">CloudFlow</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Engineering</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Zero remote image uploads and zero tracking beacons. Our legal and security teams approved ClickSnap immediately because everything stays encrypted on local machine storage.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Liam Chen</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Staff Full-Stack Engineer • <span class="text-gray-700 font-medium">ByteCraft</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Productivity</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;ClickSnap is faster, has zero arbitrary capture count limits, and includes all premium drawing tools, blur redaction, and high-DPI retina exports for free.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Sarah Jenkins</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Lead Technical Writer • <span class="text-gray-700 font-medium">DevDocs Global</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Engineering</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Testing hover menus and flyouts used to be painful because menus closed on hotkey press. The 3s/5s countdown timer solves ephemeral UI captures perfectly.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Henrik Lindqvist</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">QA Automation Lead • <span class="text-gray-700 font-medium">NordicFin</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Design</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Most extensions compress images and blur text on 4K displays. ClickSnap preserves high-DPI resolution cleanly with lossless PNG downloads.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Elena Rostova</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Head of Product Design • <span class="text-gray-700 font-medium">Kinetix Studio</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Engineering</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Background service workers sleep when idle instead of hogging 200MB of RAM. The performance difference over legacy V2 extensions is night and day.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Tariq Al-Mansoor</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Engineering Director • <span class="text-gray-700 font-medium">NexusCloud</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Founder</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;I switched from Mac to a Linux workstation and missed CleanShot X dearly. ClickSnap brings that exact premium framing and annotation feel directly to Chrome.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Chloe Monet</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Indie Hacker &amp; Creator • <span class="text-gray-700 font-medium">MicroSaaS Lab</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Security</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Rather than semi-transparent highlighters that can be inverted, ClickSnap destructively flattens redacted blocks directly onto the canvas before export.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">David Kalu</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Cybersecurity Analyst • <span class="text-gray-700 font-medium">ShieldGrid</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Productivity</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Press Cmd+Shift+F, edit, copy to clipboard, and paste into Slack. Takes under 5 seconds from capture to delivery.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Maya Patel</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Product Operations Lead • <span class="text-gray-700 font-medium">Vanguard Tech</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Design</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Every other scrolling tool leaves repeating headers in the middle of long responsive landing pages. ClickSnap temporarily hides fixed elements and produces completely seamless 100% pixel-perfect stitches with zero seams.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Alexandre Dubois</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Principal UX Architect • <span class="text-gray-700 font-medium">DesignScale</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Security</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Being able to blur API keys, tokens, and customer emails in one click directly inside Chrome before pasting screenshots into Jira has prevented massive compliance headaches for our engineering teams.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Priya Sharma</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Staff Platform Security Engineer • <span class="text-gray-700 font-medium">FinStack Core</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Founder</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;I use the mockup framing presets daily for feature announcements. The 135° mesh gradients and photorealistic 3D drop shadows look like a $100/hr designer built them in seconds.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Devon Vance</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Founder &amp; Builder • <span class="text-gray-700 font-medium">SaaSLaunch</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Productivity</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;The step annotation tool (1, 2, 3...) auto-increments with each click. Paired with curved arrows and typography badges, creating customer onboarding guides takes 30 seconds.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Marcus Brody</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Senior Product Reviewer • <span class="text-gray-700 font-medium">CloudFlow</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Engineering</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Zero remote image uploads and zero tracking beacons. Our legal and security teams approved ClickSnap immediately because everything stays encrypted on local machine storage.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Liam Chen</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Staff Full-Stack Engineer • <span class="text-gray-700 font-medium">ByteCraft</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Productivity</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;ClickSnap is faster, has zero arbitrary capture count limits, and includes all premium drawing tools, blur redaction, and high-DPI retina exports for free.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Sarah Jenkins</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Lead Technical Writer • <span class="text-gray-700 font-medium">DevDocs Global</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Engineering</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Testing hover menus and flyouts used to be painful because menus closed on hotkey press. The 3s/5s countdown timer solves ephemeral UI captures perfectly.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Henrik Lindqvist</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">QA Automation Lead • <span class="text-gray-700 font-medium">NordicFin</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Design</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Most extensions compress images and blur text on 4K displays. ClickSnap preserves high-DPI resolution cleanly with lossless PNG downloads.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Elena Rostova</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Head of Product Design • <span class="text-gray-700 font-medium">Kinetix Studio</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Engineering</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Background service workers sleep when idle instead of hogging 200MB of RAM. The performance difference over legacy V2 extensions is night and day.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Tariq Al-Mansoor</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Engineering Director • <span class="text-gray-700 font-medium">NexusCloud</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Founder</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;I switched from Mac to a Linux workstation and missed CleanShot X dearly. ClickSnap brings that exact premium framing and annotation feel directly to Chrome.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Chloe Monet</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Indie Hacker &amp; Creator • <span class="text-gray-700 font-medium">MicroSaaS Lab</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Security</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Rather than semi-transparent highlighters that can be inverted, ClickSnap destructively flattens redacted blocks directly onto the canvas before export.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">David Kalu</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Cybersecurity Analyst • <span class="text-gray-700 font-medium">ShieldGrid</span></p></div></div></div></div><div class="w-[320px] sm:w-[380px] shrink-0 group flex flex-col rounded-2xl border border-gray-200 p-1 shadow-sm bg-white hover:border-indigo-300 transition-all duration-300 hover:shadow-md">
304<div class="flex flex-1 flex-col justify-between gap-4 rounded-xl p-5 sm:p-6 bg-gray-50/80 border border-gray-100 group-hover:bg-white group-hover:border-gray-200 transition-colors"><div class="flex flex-col gap-3"><div class="flex items-center justify-between"><div class="flex items-center gap-1"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-star w-3.5 h-3.5 text-amber-500 fill-amber-500"><path d="M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z"></path></svg></div><span class="text-[10px] font-semibold text-indigo-700 bg-indigo-50 border border-indigo-100 px-2 py-0.5 rounded-full">Productivity</span></div><p class="text-xs sm:text-sm text-gray-700 leading-relaxed font-normal">&quot;Press Cmd+Shift+F, edit, copy to clipboard, and paste into Slack. Takes under 5 seconds from capture to delivery.&quot;</p></div><div class="flex items-center justify-between pt-3 border-t border-gray-200/60 mt-2"><div><div class="flex items-center gap-1.5"><h4 class="text-xs font-semibold text-gray-900">Maya Patel</h4><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shield-check w-3.5 h-3.5 text-emerald-600"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z"></path><path d="m9 12 2 2 4-4"></path></svg></div><p class="text-[11px] text-gray-500 mt-0.5">Product Operations Lead • <span class="text-gray-700 font-medium">Vanguard Tech</span></p></div></div></div></div></div></div><div class="mt-8 sm:mt-12 text-center relative z-20"><a href="/reviews" class="inline-flex items-center gap-2 px-5 py-2.5 rounded-xl bg-white hover:bg-gray-50 border border-gray-200 text-xs font-medium text-gray-800 shadow-xs hover:border-gray-300 transition-all hover:-translate-y-0.5"><span>Read All Verified Community Reviews</span><span class="text-gray-500">→</span></a></div></section><section id="faq" class="py-16 sm:py-24 bg-white border-t border-gray-100"><div class="max-w-3xl mx-auto px-4 sm:px-6"><div class="text-center max-w-2xl mx-auto mb-10 sm:mb-12"><span class="mb-3 block text-base font-medium tracking-normal text-gray-500 sm:text-lg">Got questions? We&#x27;ve got answers...</span><h2 class="text-2xl font-semibold tracking-tight text-neutral-900 sm:text-3xl md:text-4xl text-balance">Frequently Asked <span class="highlight font-semibold text-gray-900">Questions</span></h2><p class="mx-auto mt-4 max-w-xl text-sm leading-6 text-gray-600 sm:text-base sm:leading-7">Everything you need to know about ClickSnap, full-page stitching, local privacy, and Chrome installation.</p></div><div class="group rounded-2xl border border-gray-200 p-1 shadow-sm bg-white"><div class="rounded-xl divide-y divide-gray-100 bg-gray-50/60 border border-gray-100 overflow-hidden"><div class="transition-colors hover:bg-gray-100/60"><button type="button" class="w-full text-left py-4 px-5 sm:px-6 flex items-center justify-between gap-3 text-sm sm:text-base font-semibold text-gray-900"><span>Is ClickSnap completely free to use?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down w-4 h-4 text-gray-400 shrink-0 transition-transform duration-200 rotate-180 text-gray-900"><path d="m6 9 6 6 6-6"></path></svg></button><div class="px-5 sm:px-6 pb-4 pt-0 text-xs sm:text-sm text-gray-600 font-normal leading-relaxed animate-fade-in">Yes! ClickSnap is 100% free to install and use with zero subscription paywalls, watermarks, or artificial limits on captures.</div></div><div class="transition-colors hover:bg-gray-100/60"><button type="button" class="w-full text-left py-4 px-5 sm:px-6 flex items-center justify-between gap-3 text-sm sm:text-base font-semibold text-gray-900"><span>How does ClickSnap prevent repeating sticky headers during full-page capture?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down w-4 h-4 text-gray-400 shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div><div class="transition-colors hover:bg-gray-100/60"><button type="button" class="w-full text-left py-4 px-5 sm:px-6 flex items-center justify-between gap-3 text-sm sm:text-base font-semibold text-gray-900"><span>Where are my screenshots stored? Are they uploaded to the cloud?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down w-4 h-4 text-gray-400 shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div><div class="transition-colors hover:bg-gray-100/60"><button type="button" class="w-full text-left py-4 px-5 sm:px-6 flex items-center justify-between gap-3 text-sm sm:text-base font-semibold text-gray-900"><span>What image formats and resolutions can I export in?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down w-4 h-4 text-gray-400 shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div><div class="transition-colors hover:bg-gray-100/60"><button type="button" class="w-full text-left py-4 px-5 sm:px-6 flex items-center justify-between gap-3 text-sm sm:text-base font-semibold text-gray-900"><span>What keyboard shortcuts are available?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down w-4 h-4 text-gray-400 shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div><div class="transition-colors hover:bg-gray-100/60"><button type="button" class="w-full text-left py-4 px-5 sm:px-6 flex items-center justify-between gap-3 text-sm sm:text-base font-semibold text-gray-900"><span>Can I use ClickSnap offline?</span><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-down w-4 h-4 text-gray-400 shrink-0 transition-transform duration-200"><path d="m6 9 6 6 6-6"></path></svg></button></div></div></div></div></section><section id="install" class="py-16 sm:py-24 bg-white border-t border-gray-100"><div class="max-w-4xl mx-auto px-4 sm:px-6 text-center flex flex-col items-center"><div class="inline-flex antialiased relative justify-center mb-6"><div class="w-12 h-12 rounded-2xl bg-white border border-gray-200 p-2 shadow-xs flex items-center justify-center"><img src="/icons/logo.png" alt="ClickSnap" class="w-8 h-8 object-contain"/></div></div><h2 class="text-2xl sm:text-4xl lg:text-5xl font-semibold tracking-tight text-neutral-900 max-w-2xl mb-4 leading-[1.2] text-balance">Behind every great project is a story of <span class="highlight font-semibold text-gray-900">clear visual communication</span></h2><p class="mx-auto mt-2 max-w-xl text-balance text-center text-sm leading-6 text-gray-600 sm:text-base sm:leading-7 mb-8">Join thousands of developers, designers, and founders who capture, annotate, and share seamless visual proof in seconds.</p><div class="flex flex-col sm:flex-row items-center justify-center gap-3 w-full sm:w-auto"><a href="https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb" target="_blank" rel="noreferrer" class="flex w-full sm:w-auto items-center justify-center space-x-2 rounded-xl px-6 py-3 text-white transition-all duration-300 hover:-translate-y-0.5 hover:shadow-xl will-change-transform bg-gray-900 hover:bg-black font-semibold text-sm shadow-sm"><svg class="w-4 h-4 shrink-0" width="20" height="20" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24 12H44.78A24 24 0 0 0 3.22 12L13.61 30A12 12 0 0 1 24 12Z" fill="#EA4335"></path><path d="M34.39 30L24 48A24 24 0 0 0 44.78 12H24A12 12 0 0 1 34.39 30Z" fill="#FBBC05"></path><path d="M13.61 30L3.22 12A24 24 0 0 0 24 48L34.39 30A12 12 0 0 1 13.61 30Z" fill="#34A853"></path><circle cx="24" cy="24" r="12" fill="#FFFFFF"></circle><circle cx="24" cy="24" r="9.5" fill="#4285F4"></circle></svg><span>Add to Chrome for Free</span></a><button type="button" class="flex w-full sm:w-auto items-center justify-center space-x-2 rounded-xl px-6 py-3 text-gray-800 bg-white border border-gray-200 hover:bg-gray-50 transition-all font-semibold text-sm shadow-2xs hover:border-gray-300"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sparkles w-4 h-4 text-gray-700"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"></path><path d="M20 3v4"></path><path d="M22 5h-4"></path><path d="M4 17v2"></path><path d="M5 18H3"></path></svg><span>Open Web Studio</span></button></div><div class="mt-8 pt-6 border-t border-gray-100 flex flex-wrap items-center justify-center gap-2 text-xs text-gray-600"><span class="text-gray-400 font-medium">Share ClickSnap:</span><a href="https://twitter.com/intent/tweet?text=Found%20the%20best%20free%20full-page%20screenshot%20Chrome%20extension%20with%20zero%20broken%20headers%20and%20100%25%20local%20privacy%3A%20&amp;url=https%3A%2F%2Fclicksnap.live" target="_blank" rel="noreferrer" class="px-2.5 py-1 rounded-lg bg-gray-50 hover:bg-gray-100 border border-gray-200 text-gray-700 font-medium transition-colors">Post on X</a><a href="https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fclicksnap.live" target="_blank" rel="noreferrer" class="px-2.5 py-1 rounded-lg bg-gray-50 hover:bg-gray-100 border border-gray-200 text-gray-700 font-medium transition-colors">LinkedIn</a><a href="https://reddit.com/submit?url=https%3A%2F%2Fclicksnap.live&amp;
304title=ClickSnap%20-%20Free%20Full-Page%20Screenshot%20%26%20Annotation%20Chrome%20Extension" target="_blank" rel="noreferrer" class="px-2.5 py-1 rounded-lg bg-gray-50 hover:bg-gray-100 border border-gray-200 text-gray-700 font-medium transition-colors">Reddit</a><button type="button" class="px-2.5 py-1 rounded-lg bg-gray-50 hover:bg-gray-100 border border-gray-200 text-gray-700 font-medium transition-colors">Copy Link</button></div><p class="mt-4 text-xs text-gray-500 font-medium">no account required. zero data collection. 100% free.</p></div></section></main><footer class="bg-white text-gray-600 border-t border-gray-100 pt-16 pb-12 text-sm font-normal"><div class="max-w-5xl mx-auto px-4 sm:px-6 flex flex-col gap-10"><div class="grid grid-cols-2 md:grid-cols-5 gap-8"><div class="col-span-2 flex flex-col gap-3"><div class="flex items-center gap-2.5"><img src="/icons/logo.png" alt="ClickSnap Logo" class="w-8 h-8 object-contain"/><span class="font-semibold text-lg text-gray-900 tracking-tight">ClickSnap</span></div><p class="text-xs text-gray-500 leading-relaxed max-w-sm">The high-performance full-page screenshot and annotation suite. Seamless scrolling captures, instant privacy blur, and viral social mockups.</p></div><div class="flex flex-col gap-3"><h3 class="text-xs font-semibold uppercase tracking-wider text-gray-900">Product</h3><ul class="space-y-2 text-xs"><li><a href="/#features" class="hover:text-gray-900 transition-colors">Features</a></li><li><a href="/#interactive-demo" class="hover:text-gray-900 transition-colors">Live Studio</a></li><li><a href="/comparison" class="hover:text-gray-900 transition-colors">Compare Tools</a></li><li><a href="/reviews" class="hover:text-gray-900 transition-colors">Wall of Love</a></li><li><a href="/docs?article=version-history" class="hover:text-gray-900 transition-colors flex items-center gap-1.5 font-medium text-primary-600"><span>Version History</span><span class="text-[10px] bg-primary-50 text-primary-700 px-1 rounded border border-primary-200">v1.0.1</span></a></li></ul></div><div class="flex flex-col gap-3"><h3 class="text-xs font-semibold uppercase tracking-wider text-gray-900">Resources</h3><ul class="space-y-2 text-xs"><li><a href="/blog" class="hover:text-gray-900 transition-colors">Guides &amp; Blog</a></li><li><a href="/docs" class="hover:text-gray-900 transition-colors">Documentation</a></li><li><a href="/docs?article=version-history" class="hover:text-gray-900 transition-colors">Release Notes</a></li><li><a href="/#faq" class="hover:text-gray-900 transition-colors">FAQ</a></li><li class="flex items-center gap-1.5 text-gray-500"><span>GitHub Open Source</span><span class="text-[10px] font-medium text-amber-700 bg-amber-50 border border-amber-200/80 px-1.5 py-0.5 rounded leading-none">Coming Soon</span></li></ul></div><div class="flex flex-col gap-3"><h3 class="text-xs font-semibold uppercase tracking-wider text-gray-900">Legal &amp; Privacy</h3><ul class="space-y-2 text-xs"><li><a href="/privacy" class="hover:text-gray-900 transition-colors">Privacy Policy</a></li><li><a href="/terms" class="hover:text-gray-900 transition-colors">Terms of Service</a></li><li><a href="/license" class="hover:text-gray-900 transition-colors">MIT License</a></li></ul></div></div><div class="flex flex-col md:flex-row items-center justify-between gap-3.5 py-4 px-4 sm:px-5 rounded-xl bg-gray-50/90 border border-gray-200/80"><div class="flex items-center gap-2.5 text-center md:text-left"><div class="w-2 h-2 rounded-full bg-indigo-600 animate-pulse"></div><h4 class="text-xs font-semibold text-gray-900 tracking-tight">ClickSnap on Top AI Answer Engines:</h4></div><div class="flex items-center justify-center flex-wrap gap-2 sm:gap-2.5"><a href="https://www.perplexity.ai/search?q=What+is+ClickSnap+and+who+developed+it+https%3A%2F%2Fclicksnap.live" target="_blank" rel="noreferrer" class="flex items-center gap-2 text-xs font-medium text-gray-700 hover:text-gray-900 bg-white hover:bg-gray-50 px-2.5 py-1.5 rounded-lg border border-gray-200 shadow-2xs hover:border-cyan-400 transition-all"><svg viewBox="0 0 24 24" class="w-4 h-4 text-[#1FB8CD]" fill="currentColor"><path d="M22.3977 7.0896h-2.3106V.0676l-7.5094 6.3542V.1577h-1.1554v6.1966L4.4904 0v7.0896H1.6023v10.3976h2.8882V24l6.932-6.3591v6.2005h1.1554v-6.0469l6.9318 6.1807v-6.4879h2.8882V7.0896zm-3.4657-4.531v4.531h-5.355l5.355-4.531zm-13.2862.0676 4.8691 4.4634H5.6458V2.6262zM2.7576 16.332V8.245h7.8476l-6.1149 6.1147v1.9723H2.7576zm2.8882 5.0404v-3.8852h.0001v-2.6488l5.7763-5.7764v7.0111l-5.7764 5.2993zm12.7086.0248-5.7766-5.1509V9.0618l5.7766 5.7766v6.5588zm2.8882-5.0652h-1.733v-1.9723L13.3948 8.245h7.8478v8.087z"></path></svg><span>Perplexity</span></a><a href="https://chatgpt.com/?q=What+is+ClickSnap+and+who+developed+it+https%3A%2F%2Fclicksnap.live" target="_blank" rel="noreferrer" class="flex items-center gap-2 text-xs font-medium text-gray-700 hover:text-gray-900 bg-white hover:bg-gray-50 px-2.5 py-1.5 rounded-lg border border-gray-200 shadow-2xs hover:border-emerald-400 transition-all"><svg viewBox="0 0 24 24" class="w-4 h-4 text-[#10A37F]" fill="currentColor"><path d="M22.2819 9.8211a5.9847 5.9847 0 0 0-.5157-4.9108 6.0462 6.0462 0 0 0-6.5098-2.9A6.0651 6.0651 0 0 0 4.9807 4.1818a5.9847 5.9847 0 0 0-3.9977 2.9 6.0462 6.0462 0 0 0 .7427 7.0966 5.98 5.98 0 0 0 .511 4.9107 6.051 6.051 0 0 0 6.5146 2.9001A5.9847 5.9847 0 0 0 13.259 24a6.0557 6.0557 0 0 0 5.7718-4.2058 5.9894 5.9894 0 0 0 3.9977-2.9001 6.0557 6.0557 0 0 0-.7466-7.0729zm-9.022 12.6081a4.4755 4.4755 0 0 1-2.8764-1.0408l.1419-.0804 4.7783-2.7582a.7948.7948 0 0 0 .3927-.6813v-6.7369l2.02 1.1683a.071.071 0 0 1 .038.052v5.5826a4.5045 4.5045 0 0 1-4.4945 4.4947zm-9.6607-4.1254a4.4708 4.4708 0 0 1-.5346-3.0137l.142.0852 4.783 2.7582a.7712.7712 0 0 0 .7806 0l5.8428-3.3685v2.3324a.0804.0804 0 0 1-.0332.0615L9.74 19.9502a4.4992 4.4992 0 0 1-6.1408-1.6464zM2.3408 7.8956a4.485 4.485 0 0 1 2.3655-1.9728V11.6a.7664.7664 0 0 0 .3879.6765l5.8144 3.3543-2.0201 1.1683a.0757.0757 0 0 1-.071 0l-4.8303-2.7866A4.504 4.504 0 0 1 2.3408 7.872zm16.5963 3.8558L13.1038 8.364 15.1192 7.2a.0757.0757 0 0 1 .071 0l4.8303 2.7913a4.4944 4.4944 0 0 1-.6765 8.1042v-5.6772a.7948.7948 0 0 0-.407-.667zm2.0107-3.0231l-.142-.0852-4.7735-2.7818a.7759.7759 0 0 0-.7854 0L9.409 9.2297V6.8974a.0662.0662 0 0 1 .0284-.0615l4.8303-2.7866a4.4992 4.4992 0 0 1 6.6802 4.66zM8.3065 12.863l-2.02-1.1636a.0804.0804 0 0 1-.038-.0567V6.0742a4.4992 4.4992 0 0 1 7.3757-3.4537l-.142.0805L8.704 5.459a.7948.7948 0 0 0-.3927.6813l-.0048 6.7227zm1.1458-1.7708l3.0544-1.7613 3.0496 1.7613v3.5225l-3.0496 1.7613-3.0544-1.7613z"></path></svg><span>ChatGPT</span></a><a href="https://claude.ai/new?q=What+is+ClickSnap+and+who+developed+it+https%3A%2F%2Fclicksnap.live" target="_blank" rel="noreferrer" class="flex items-center gap-2 text-xs font-medium text-gray-700 hover:text-gray-900 bg-white hover:bg-gray-50 px-2.5 py-1.5 rounded-lg border border-gray-200 shadow-2xs hover:border-amber-400 transition-all"><svg viewBox="0 0 24 24" class="w-4 h-4 text-[#D97757]" fill="currentColor"><path d="M17.3041 3.541h-3.6718l6.696 16.918H24Zm-10.6082 0L0 20.459h3.7442l1.3693-3.5527h7.0052l1.3693 3.5528h3.7442L10.5363 3.5409Zm-.3712 10.2232 2.2914-5.9456 2.2914 5.9456Z"></path></svg><span>Claude</span></a><a href="https://gemini.google.com/app" target="_blank" rel="noreferrer" class="flex items-center gap-2 text-xs font-medium text-gray-700 hover:text-gray-900 bg-white hover:bg-gray-50 px-2.5 py-1.5 rounded-lg border border-gray-200 shadow-2xs hover:border-blue-400 transition-all"><svg viewBox="0 0 24 24" class="w-4 h-4"><defs><linearGradient id="real-gemini-gradient" x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stop-color="#1BA1E2"></stop><stop offset="35%" stop-color="#4285F4"></stop><stop offset="70%" stop-color="#9B51E0"></stop><stop offset="100%" stop-color="#EA4335"></stop></linearGradient></defs><path d="M11.04 19.32Q12 21.51 12 24q0-2.49.93-4.68.96-2.19 2.58-3.81t3.8
3041-2.55Q21.51 12 24 12q-2.49 0-4.68-.93a12.3 12.3 0 0 1-3.81-2.58 12.3 12.3 0 0 1-2.58-3.81Q12 2.49 12 0q0 2.49-.96 4.68-.93 2.19-2.55 3.81a12.3 12.3 0 0 1-3.81 2.58Q2.49 12 0 12q2.49 0 4.68.96 2.19.93 3.81 2.55t2.55 3.81" fill="url(#real-gemini-gradient)"></path></svg><span>Google Gemini</span></a><a href="https://www.google.com/search?q=what+is+clicksnap+and+who+are+clicksnap+google+extension+developers+clicksnap.live" target="_blank" rel="noreferrer" class="flex items-center gap-2 text-xs font-medium text-gray-700 hover:text-gray-900 bg-white hover:bg-gray-50 px-2.5 py-1.5 rounded-lg border border-gray-200 shadow-2xs hover:border-indigo-400 transition-all"><svg viewBox="0 0 24 24" class="w-4 h-4"><path d="M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z" fill="#4285F4"></path><path d="M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z" fill="#34A853"></path><path d="M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.06H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.94l2.85-2.22.81-.63z" fill="#FBBC05"></path><path d="M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.06l3.66 2.84c.87-2.6 3.3-4.52 6.16-4.52z" fill="#EA4335"></path></svg><span>Google SGE</span></a></div></div><div class="pt-2 border-t border-gray-100 flex flex-col md:flex-row items-center justify-between gap-4 text-xs text-gray-500"><div>© 2026 ClickSnap. All rights reserved.</div><div class="flex items-center gap-2"><a href="https://chromewebstore.google.com/detail/hgcifincdljnbpbdpjhaobmfnlkakhkf?utm_source=item-share-cb" target="_blank" rel="noreferrer" class="text-[11px] font-semibold text-gray-800 hover:text-black bg-gray-50 border border-gray-200 hover:border-gray-300 px-2.5 py-1 rounded-md transition-colors">Chrome Web Store Official</a></div></div></div></footer></div></div>
305  </body>
306</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.