PageSourceSearch

https://previewlinks.io/

html previewlinks.io collected 2026-10-09 21:46:03 UTC 77,107 bytes, 1,405 lines download raw bytes

1<!DOCTYPE html>
2<html
3    class="scroll-behavior-smooth"
4    lang="en"
5>
6
7<head>
8            <!-- Google tag (gtag.js) -->
vendor: 72 bytes, lines 8-9
8
9        <script async src="https://www.googletagmanager.com/gtag/js?id=
9G-JXXQEPPTM9
vendor: 20 bytes, lines 9-10
9"></script>
10        
10<script>
11        
vendor: 152 bytes, lines 11-15
11window.dataLayer = window.dataLayer || [];
12        function gtag(){dataLayer.push(arguments);}
13        gtag('js', new Date());
14
15        gtag('config', '
15G-JXXQEPPTM9
vendor: 12 bytes, lines 15-16
15');
16        
16</script>
16
17    
18    <meta charset="UTF-8">
19
20    <meta
21        http-equiv="X-UA-Compatible"
22        content="IE=edge"
23    >
24
25    <meta
26        name="viewport"
27        content="width=device-width, initial-scale=1.0"
28    >
29
30    <title>Automated link previews for your site — PreviewLinks</title>
31    <meta property="og:title" content="Automated link previews for your site — PreviewLinks" />
32
33 
34    <meta property="og:description" content="Save more time and money by automating your link previews on socials using PreviewLinks. No need for designers, Just plug and play." />
35    <meta name="description" content="Save more time and money by automating your link previews on socials using PreviewLinks. No need for designers, Just plug and play." />
36
37<meta property="og:type" content="website" />
38
39 <meta property="og:site_name" content="Automated link previews for your site — PreviewLinks"> 
40 <meta property="og:image" content="https://previewlinks.io/generate/templates/828/signed?fields=eyJwcmV2aWV3bGlua3M6dGl0bGUiOiJFYXNpbHkgZ2VuZXJhdGUgbGluayBwcmV2aWV3cyBsaWtlIHRoaXMgb25lIFx1MjcyOCIsInByZXZpZXdsaW5rczppbWFnZSI6Imh0dHBzOlwvXC9wcmV2aWV3bGlua3MuaW9cL2Fzc2V0c1wvdHlwb2dyYXBoeS1sb2dvLXdoaXRlLnN2ZyJ9&signature=59aacffb681408e625ced318f05f9bba4f0174b0c38d8bf2019f9e08475edc47" /> 
41    <meta property="og:url" content="https://previewlinks.io" />
42    <link rel="canonical" href="https://previewlinks.io" />
43
44
45    <meta name="twitter:card" content="summary_large_image">
46 <meta name="twitter:site" content="@previewify">  <meta name="twitter:title" content="Automated link previews for your site — PreviewLinks">  <meta name="twitter:description" content="Save more time and money by automating your link previews on socials using PreviewLinks. No need for designers, Just plug and play.">  <meta name="twitter:image" content="https://previewlinks.io/generate/templates/828/signed?fields=eyJwcmV2aWV3bGlua3M6dGl0bGUiOiJFYXNpbHkgZ2VuZXJhdGUgbGluayBwcmV2aWV3cyBsaWtlIHRoaXMgb25lIFx1MjcyOCIsInByZXZpZXdsaW5rczppbWFnZSI6Imh0dHBzOlwvXC9wcmV2aWV3bGlua3MuaW9cL2Fzc2V0c1wvdHlwb2dyYXBoeS1sb2dvLXdoaXRlLnN2ZyJ9&signature=59aacffb681408e625ced318f05f9bba4f0174b0c38d8bf2019f9e08475edc47" />     <link rel="icon" type="image/x-icon" href="https://previewlinks.io/favicon.ico">
47<link rel="icon" type="image/png" href="https://previewlinks.io/favicon.png">
48
49    <style>
50        [x-cloak] {
51            display: none !important;
52        }
53
54    </style>
55
56        
57    <style >/* vietnamese */
58@font-face {
59  font-family: 'Be Vietnam Pro';
60  font-style: normal;
61  font-weight: 400;
62  font-display: swap;
63  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvpstaylfyeg-idwvojmves-hw4bxoyz7ajsh8.woff2) format('woff2');
64  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
65}
66/* latin-ext */
67@font-face {
68  font-family: 'Be Vietnam Pro';
69  font-style: normal;
70  font-weight: 400;
71  font-display: swap;
72  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvpstaylfyeg-idwvojmves-hw5bxoyz7ajsh8.woff2) format('woff2');
73  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
74}
75/* latin */
76@font-face {
77  font-family: 'Be Vietnam Pro';
78  font-style: normal;
79  font-weight: 400;
80  font-display: swap;
81  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvpstaylfyeg-idwvojmves-hw3bxoyz7aj.woff2) format('woff2');
82  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
83}
84/* vietnamese */
85@font-face {
86  font-family: 'Be Vietnam Pro';
87  font-style: normal;
88  font-weight: 500;
89  font-display: swap;
90  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvmstaylfyeg-idwvojmves-htejm86rb0jcbaouuu.woff2) format('woff2');
91  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
92}
93/* latin-ext */
94@font-face {
95  font-family: 'Be Vietnam Pro';
96  font-style: normal;
97  font-weight: 500;
98  font-display: swap;
99  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvmstaylfyeg-idwvojmves-htejm87rb0jcbaouuu.woff2) format('woff2');
100  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1D
100BF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
101}
102/* latin */
103@font-face {
104  font-family: 'Be Vietnam Pro';
105  font-style: normal;
106  font-weight: 500;
107  font-display: swap;
108  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvmstaylfyeg-idwvojmves-htejm81rb0jcbao.woff2) format('woff2');
109  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
110}
111/* vietnamese */
112@font-face {
113  font-family: 'Be Vietnam Pro';
114  font-style: normal;
115  font-weight: 700;
116  font-display: swap;
117  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvmstaylfyeg-idwvojmves-hsmig86rb0jcbaouuu.woff2) format('woff2');
118  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
119}
120/* latin-ext */
121@font-face {
122  font-family: 'Be Vietnam Pro';
123  font-style: normal;
124  font-weight: 700;
125  font-display: swap;
126  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvmstaylfyeg-idwvojmves-hsmig87rb0jcbaouuu.woff2) format('woff2');
127  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
128}
129/* latin */
130@font-face {
131  font-family: 'Be Vietnam Pro';
132  font-style: normal;
133  font-weight: 700;
134  font-display: swap;
135  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sbevietnamprov12qdvmstaylfyeg-idwvojmves-hsmig81rb0jcbao.woff2) format('woff2');
136  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
137}
138/* latin-ext */
139@font-face {
140  font-family: 'DM Mono';
141  font-style: normal;
142  font-weight: 400;
143  font-display: swap;
144  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sdmmonov16aftu7pb1qtsux8kythsqbk6pyk3exw.woff2) format('woff2');
145  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
146}
147/* latin */
148@font-face {
149  font-family: 'DM Mono';
150  font-style: normal;
151  font-weight: 400;
152  font-display: swap;
153  src: url(https://previewlinks.on-forge.com/storage/fonts/a1abb9beed/sdmmonov16aftu7pb1qtsux8kythqqbk6pyk0.woff2) format('woff2');
154  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
155}
156</style>
157    <link
158        rel="stylesheet"
159        href="/css/app.css?id=5bac4e00b07e674d67a2"
160    >
161
162    
162<script
163        src="/js/marketing.js?id=d092cb6bc4f923b71312"
164        defer
165    ></script>
165
166</head>
167
168<body class="font-sans antialiased text-black">
169    <div class="flex flex-col min-h-screen">
170        <header
171            class="sticky top-0 z-30 ring-1 text-white bg-rose-500 ring-white/10 opacity-90"
172            x-data="{ open: false }"
173        >
174            <div class="container">
175                <nav class="flex flex-col gap-4 py-4 sm:gap-6 md:items-center md:flex-row">
176                    <div class="flex justify-between">
177                        <a
178                            class="inline-flex items-center gap-2 text-lg font-bold tracking-tighter"
179                            href="https://previewlinks.io"
180                        >
181                            <svg
182                                class="h-5"
183                                xmlns="http://www.w3.org/2000/svg"
184                                viewBox="0 0 277 320"
185                            >
186                                <path
187                                    d="M276.958 109.946v100.62l-94.395 54.454-86.612-49.789 54.457-31.635 40.453-23.336-9.854-5.705-94.39-54.979h-.52V0l182.045 104.767 8.816 5.179ZM0 50.307v219.905L86.097 320V100.095L0 50.307Z"
188                                    fill="currentColor"
189                                />
190                            </svg>
191
192                            <span>PreviewLinks</span>
193                        </a>
194
195                        <button
196                            title="Open and close menu"
197                            x-on:click="open = !open"
198                            class="gap-2 md:hidden button button-small button-secondary-white"
199                        >
200                            <span>Menu</span>
201
202                            <svg
203                                xmlns="http://www.w3.org/2000/svg"
204                                class="w-5 h-5"
205                                viewBox="0 0 20 20"
206                                fill="currentColor"
207                            >
208                                <path
209                                    fill-rule="evenodd"
210                                    d="M3 7a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 13a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z"
211                                    clip-rule="evenodd"
212                                />
213                            </svg>
214                        </button>
215                    </div>
216
217                    <div
218                        class="flex-col justify-between hidden w-full gap-6 md:flex md:flex-row"
219                        x-bind:class="{
220                            'flex': open,
221                            'hidden': !open,
222                        }"
223                    >
224                        <ul class="flex flex-col gap-6 text-sm font-medium md:items-center md:flex-row">
225                            
226
227                            
228
229                            <li>
230                                <a
231                                    class="transition hover:opacity-60"
232                                    href="https://previewlinks.io/integrations"
233                                >Integrations</a>
234                            </li>
235
236                            <li>
237                                <a
238                                    class="transition hover:opacity-60"
239                                    href="https://previewlinks.io/pricing"
240                                >Pricing</a>
241                            </li>
242
243                            <li>
244                                <a
245                                    class="transition hover:opacity-60"
246                                    href="https://previewlinks.io/blog"
247                                >Blog</a>
248                            </li>
249                        </ul>
250
251                        <ul class="flex items-center gap-3">
252                            <li>
253                                <a
254                                    class="button button-small button-secondary-white"
255                                    href="https://previewlinks.io/app/login"
256                                >Sign in</a>
257                            </li>
258
259                            <li>
260                                <a
261                                    class="button button-aqua button-small"
262                                    href="https://previewlinks.io/app/register"
263                                >Sign up for free</a>
264                            </li>
265                        </ul>
266                    </div>
267                </nav>
268            </div>
269        </header>
270
271        <section class="relative py-12 text-white bg-rose-400 md:py-24">
272        <img
273            src="https://previewlinks.io/assets/gradient.png"
274            class="absolute inset-0 bottom-0 w-full h-full opacity-60"
275            alt=""
276        >
277
278        <div class="container relative">
279            <header class="flex flex-col items-center text-center">
280                <h1 class="text-3xl font-bold tracking-tighter md:text-5xl lg:text-7xl">
281                                        1,000<span class="text-xl">s</span> more clicks <br> with Automated Link Previews!
282                </h1>
283
284                <p class="max-w-3xl mt-6 text-lg font-medium md:text-xl lg:text-2xl">
285                    Say goodbye to Canva! Create a template, integrate it into your site once, and focus on creating great content.
286                </p>
287
288                <a
289                    class="mt-6 button md:button-large button-aqua"
290                    href="https://previewlinks.io/app/register"
291                >Try PreviewLinks free for 7 days</a>
292            </header>
293
294            <div x-data="{ currentDiv: 1, interval: null }" x-intersect.threshold.50="interval = setInterval(() => { currentDiv = currentDiv === 3 ? 1 : currentDiv + 1 }, 5000)" x-intersect:leave="clearInterval(interval);">
295                <ul x-show.transition.in="currentDiv === 1" class="grid items-center justify-center md:grid-cols-[1fr,auto,1fr] gap-6 mt-12 md:mt-24">
296                    <li>
297                        <div
298                            class="overflow-hidden shadow-xl bg-black/30 backdrop-blur-xl backdrop-saturate-150 rounded-xl ring-1 ring-white/10 shadow-black/25">
299                            <div class="aspect-[1.91/1] flex items-center justify-center">
300                                <svg
301                                    xmlns="http://www.w3.org/2000/svg"
302                                    class="w-12 h-12 text-white/10"
303                                    fill="none"
304                                    viewBox="0 0 24 24"
305                                    stroke="currentColor"
306                                >
307                                    <path
308                                        stroke-linecap="round"
309                                        stroke-linejoin="round"
310                                        stroke-width="1.5"
311                                        d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"
312                                    />
313                                </svg>
314                            </div>
315
316                            <div class="p-6 border-t border-white/10">
317                                <div class="text-xs font-medium tracking-wider uppercase text-white/60">
318                                    example.com
319                                </div>
320
321                                <div class="mt-1.5 text-xl font-bold tracking-tight">
322                                    No automated link previews
323                                </div>
324
325                                <div class="text-white/60">
326                                    Less clicks, less conversion, less brand recognition
327                                </div>
328                            </div>
329                        </div>
330                    </li>
331
332                    <li class="flex flex-col items-center justify-center text-3xl font-bold tracking-tighter">
333                        <div class="flex my-2">CTA
334                            <div class="h-full mx-auto ml-3">
335                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-8 h-8 mx-auto text-green-200">
336                                    <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941" />
337                                </svg>
338                            </div>
339                        </div>
340                        <svg
341                            xmlns="http://www.w3.org/2000/svg"
342                            class="w-12 h-12 rotate-90 text-white/25 md:rotate-0"
343                            fill="none"
344                            viewBox="0 0 24 24"
345                            stroke="currentColor"
346                        >
347                            <path
348                                stroke-linecap="round"
349                                stroke-linejoin="round"
350                                stroke-width="1.5"
351                                d="M14 5l7 7m0 0l-7 7m7-7H3"
352                            />
353                        </svg>
354                    </li>
355
356                    <li>
357                        <div
358                            class="overflow-hidden shadow-xl bg-black/30 backdrop-blur-xl backdrop-saturate-150 rounded-xl ring-1 ring-white/10 shadow-black/25">
359                            <div class="aspect-[1.91/1] flex items-center justify-center relative">
360                                <img
361                                    src="https://previewlinks.io/assets/previews/hero.jpg"
362                                    alt="Example preview"
363                                    class="absolute inset-0 object-cover w-full h-full"
364                                >
365                            </div>
366
367                            <div class="p-6 border-t border-white/10">
368                                <div class="text-xs font-medium tracking-wider uppercase text-white/60">
369                                    example.com
370                                </div>
371
372                                <div class="mt-1.5 text-xl font-bold tracking-tight">
373                                    Automated link previews
374                                </div>
375
376                                <div class="text-white/60">
377                                    More clicks, more conversion, more brand recognition
378                                </div>
379                            </div>
380                        </div>
381                    </li>
382                </ul>
383                <ul x-show.transition.in="currentDiv === 2" class="grid items-center justify-center md:grid-cols-[1fr,auto,1fr] gap-6 mt-12 md:mt-24">
384                    <li>
385                        <img class="relative h-auto max-w-full mx-auto pointer-events-none md:max-w-none" src="https://previewlinks.io/assets/mockups/iphone.png" width="344" height="674" alt="iPhone mockup" aria-hidden="true">
386                    </li>
387                    <li class="flex flex-col items-center justify-center text-3xl font-bold tracking-tighter">
388                        <span class="my-2 w-[183px] mx-auto text-center">On Messaging</span>
389                        <svg
390                            xmlns="http://www.w3.org/2000/svg"
391                            class="w-12 h-12 rotate-90 text-white/25 md:rotate-0"
392                            fill="none"
393                            viewBox="0 0 24 24"
394                            stroke="currentColor"
395                        >
396                            <path
397                                stroke-linecap="round"
398                                stroke-linejoin="round"
399                                stroke-width="1.5"
400                                d="M14 5l7 7m0 0l-7 7m7-7H3"
401                            />
402                        </svg>
403                    </li>
404                    <li>
405                        <img class="relative h-auto max-w-full mx-auto pointer-events-none md:max-w-none" src="https://previewlinks.io/assets/mockups/iphone.png" width="344" height="674" alt="iPhone mockup" aria-hidden="true">
406                    </li>
407                </ul>
408                <ul x-show.transition.in="currentDiv === 3" class="grid items-center justify-center md:grid-cols-[1fr,auto,1fr] gap-6 mt-12 md:mt-24">
409                    <li>
410                        <img class="relative h-auto max-w-full mx-auto rounded-lg pointer-events-none md:max-w-none" src="https://previewlinks.io/assets/mockups/iphone.png" width="344" height="674" alt="iPhone mockup" aria-hidden="true">
411                    </li>
412                    <li class="flex flex-col items-center justify-center text-3xl font-bold tracking-tighter">
413                        <span class="my-2 w-[183px] mx-auto text-center">On Social</span>
414                        <svg
415                            xmlns="http://www.w3.org/2000/svg"
416                            class="w-12 h-12 rotate-90 text-white/25 md:rotate-0"
417                            fill="none"
418                            viewBox="0 0 24 24"
419                            stroke="currentColor"
420                        >
421                            <path
422                                stroke-linecap="round"
423                                stroke-linejoin="round"
424                                stroke-width="1.5"
425                                d="M14 5l7 7m0 0l-7 7m7-7H3"
426                            />
427                        </svg>
428                    </li>
429                    <li>
430                        <img class="relative h-auto max-w-full mx-auto rounded-lg pointer-events-none md:max-w-none" src="https://previewlinks.io/assets/mockups/iphone.png" width="344" height="674" alt="iPhone mockup" aria-hidden="true">
431                    </li>
432                </ul>
433            </div>
434        </div>
435    </section>
436    <section class="my-12 md:my-24">
437    <div class="container space-y-12 md:space-y-24">
438        <header class="flex flex-col items-start">
439    <p class="md:text-xl font-bold tracking-tight text-aqua">Benefits</p>
440
441    <h2 class="max-w-4xl mt-6 text-3xl font-bold tracking-tighter md:text-5xl lg:text-6xl">
442        Accelerate your blog growth?
443
444                    <span class="block text-black/40">
445                Start with automating link previews.
446            </span>
447            </h2>
448
449            <p class="max-w-3xl mt-6 text-lg font-medium md:text-xl lg:text-2xl text-black/60">
450            Maximize your online presence with engaging link previews! Attract attention and drive clicks in social feeds and chats.
451        </p>
452    
453    
454</header>
455
456        <ul class="grid gap-12 md:grid-cols-3">
457            <li>
458                <div
459                    class="flex items-center justify-center w-12 h-12 bg-white shadow-lg text-aqua rounded-xl ring-1 ring-black/5 shadow-black/10">
460                    <svg
461                        xmlns="http://www.w3.org/2000/svg"
462                        class="w-5 h-5 drop-shadow"
463                        viewBox="0 0 20 20"
464                        fill="currentColor"
465                    >
466                        <path
467                            fill-rule="evenodd"
468                            d="M6.672 1.911a1 1 0 10-1.932.518l.259.966a1 1 0 001.932-.518l-.26-.966zM2.429 4.74a1 1 0 10-.517 1.932l.966.259a1 1 0 00.517-1.932l-.966-.26zm8.814-.569a1 1 0 00-1.415-1.414l-.707.707a1 1 0 101.415 1.415l.707-.708zm-7.071 7.072l.707-.707A1 1 0 003.465 9.12l-.708.707a1 1 0 001.415 1.415zm3.2-5.171a1 1 0 00-1.3 1.3l4 10a1 1 0 001.823.075l1.38-2.759 3.018 3.02a1 1 0 001.414-1.415l-3.019-3.02 2.76-1.379a1 1 0 00-.076-1.822l-10-4z"
469                            clip-rule="evenodd"
470                        />
471                    </svg>
472                </div>
473
474                <h3 class="mt-6 text-2xl font-bold tracking-tighter">
475                    Increase your CTR
476                </h3>
477
478                <p class="mt-1.5 text-black/60 text-lg">
479                    Your audience is more likely to click your links if they have previews containing info about
480                    your page.
481                </p>
482            </li>
483
484            <li>
485                <div
486                    class="flex items-center justify-center w-12 h-12 bg-white shadow-lg text-floral rounded-xl ring-1 ring-black/5 shadow-black/10">
487                    <svg
488                        xmlns="http://www.w3.org/2000/svg"
489                        class="w-5 h-5 drop-shadow"
490                        viewBox="0 0 20 20"
491                        fill="currentColor"
492                    >
493                        <path d="M10 12a2 2 0 100-4 2 2 0 000 4z" />
494                        <path
495                            fill-rule="evenodd"
496                            d="M.458 10C1.732 5.943 5.522 3 10 3s8.268 2.943 9.542 7c-1.274 4.057-5.064 7-9.542 7S1.732 14.057.458 10zM14 10a4 4 0 11-8 0 4 4 0 018 0z"
497                            clip-rule="evenodd"
498                        />
499                    </svg>
500                </div>
501
502                <h3 class="mt-6 text-2xl font-bold tracking-tighter">
503                    Grow your brand
504                </h3>
505
506                <p class="mt-1.5 text-black/60 text-lg">
507                    People will always scan your link previews, having a branded one will increase familiarity and
508                    trust.
509                </p>
510            </li>
511
512            <li>
513                <div
514                    class="flex items-center justify-center w-12 h-12 bg-white shadow-lg text-mango rounded-xl ring-1 ring-black/5 shadow-black/10">
515                    <svg
516                        xmlns="http://www.w3.org/2000/svg"
517                        class="w-5 h-5 drop-shadow"
518                        viewBox="0 0 20 20"
519                        fill="currentColor"
520                    >
521                        <path
522                            fill-rule="evenodd"
523                            d="M3 4a1 1 0 011-1h4a1 1 0 010 2H6.414l2.293 2.293a1 1 0 01-1.414 1.414L5 6.414V8a1 1 0 01-2 0V4zm9 1a1 1 0 110-2h4a1 1 0 011 1v4a1 1 0 11-2 0V6.414l-2.293 2.293a1 1 0 11-1.414-1.414L13.586 5H12zm-9 7a1 1 0 112 0v1.586l2.293-2.293a1 1 0 011.414 1.414L6.414 15H8a1 1 0 110 2H4a1 1 0 01-1-1v-4zm13-1a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 110-2h1.586l-2.293-2.293a1 1 0 011.414-1.414L15 13.586V12a1 1 0 011-1z"
524                            clip-rule="evenodd"
525                        />
526                    </svg>
527                </div>
528
529                <h3 class="mt-6 text-2xl font-bold tracking-tighter">
530                    We scale with you
531                </h3>
532
533                <p class="mt-1.5 text-black/60 text-lg">
534                    We handle the generation and storage of the images, you focus on what you do best.
535                </p>
536            </li>
537
538            <li>
539                <div
540                    class="flex items-center justify-center w-12 h-12 bg-white shadow-lg text-floral rounded-xl ring-1 ring-black/5 shadow-black/10">
541                    <svg
542                        xmlns="http://www.w3.org/2000/svg"
543                        class="w-5 h-5 drop-shadow"
544                        viewBox="0 0 20 20"
545                        fill="currentColor"
546                    >
547                        <path
548                            fill-rule="evenodd"
549                            d="M6 2a2 2 0 00-2 2v12a2 2 0 002 2h8a2 2 0 002-2V7.414A2 2 0 0015.414 6L12 2.586A2 2 0 0010.586 2H6zm1 8a1 1 0 100 2h6a1 1 0 100-2H7z"
550                            clip-rule="evenodd"
551                        />
552                    </svg>
553                </div>
554
555                <h3 class="mt-6 text-2xl font-bold tracking-tighter">
556                    No more files and versions
557                </h3>
558
559                <p class="mt-1.5 text-black/60 text-lg">
560                    "Where's that FinalPreviewV2.psd?" is now past time. Work directly inside your new online
561                    environment.
562                </p>
563            </li>
564
565            <li>
566                <div
567                    class="flex items-center justify-center w-12 h-12 bg-white shadow-lg text-mango rounded-xl ring-1 ring-black/5 shadow-black/10">
568                    <svg
569                        xmlns="http://www.w3.org/2000/svg"
570                        class="w-5 h-5 drop-shadow"
571                        viewBox="0 0 20 20"
572                        fill="currentColor"
573                    >
574                        <path
575                            fill-rule="evenodd"
576                            d="M4 3a2 2 0 00-2 2v10a2 2 0 002 2h12a2 2 0 002-2V5a2 2 0 00-2-2H4zm12 12H4l4-8 3 6 2-4 3 6z"
577                            clip-rule="evenodd"
578                        />
579                    </svg>
580                </div>
581
582                <h3 class="mt-6 text-2xl font-bold tracking-tighter">
583                    No more hassling with images
584                </h3>
585
586                <p class="mt-1.5 text-black/60 text-lg">
587                    There's no need to export and upload images to your CMS. Just integrate PreviewLinks once and
588                    we'll do the rest.
589                </p>
590            </li>
591
592            <li>
593                <div
594                    class="flex items-center justify-center w-12 h-12 bg-white shadow-lg text-aqua rounded-xl ring-1 ring-black/5 shadow-black/10">
595                    <svg
596                        xmlns="http://www.w3.org/2000/svg"
597                        class="w-5 h-5 drop-shadow"
598                        viewBox="0 0 20 20"
599                        fill="currentColor"
600                    >
601                        <path
602                            d="M8.433 7.418c.155-.103.346-.196.567-.267v1.698a2.305 2.305 0 01-.567-.267C8.07 8.34 8 8.114 8 8c0-.114.07-.34.433-.582zM11 12.849v-1.698c.22.071.412.164.567.267.364.243.433.468.433.582 0 .114-.07.34-.433.582a2.305 2.305 0 01-.567.267z"
603                        />
604                        <path
605                            fill-rule="evenodd"
606                            d="M10 18a8 8 0 100-16 8 8 0 000 16zm1-13a1 1 0 10-2 0v.092a4.535 4.535 0 00-1.676.662C6.602 6.234 6 7.009 6 8c0 .99.602 1.765 1.324 2.246.48.32 1.054.545 1.676.662v1.941c-.391-.127-.68-.317-.843-.504a1 1 0 10-1.51 1.31c.562.649 1.413 1.076 2.353 1.253V15a1 1 0 102 0v-.092a4.535 4.535 0 001.676-.662C13.398 13.766 14 12.991 14 12c0-.99-.602-1.765-1.324-2.246A4.535 4.535 0 0011 9.092V7.151c.391.127.68.317.843.504a1 1 0 101.511-1.31c-.563-.649-1.413-1.076-2.354-1.253V5z"
607                            clip-rule="evenodd"
608                        />
609                    </svg>
610                </div>
611
612                <h3 class="mt-6 text-2xl font-bold tracking-tighter">
613                    Save time, save money
614                </h3>
615
616                <p class="mt-1.5 text-black/60 text-lg">
617                    PreviewLinks.io is designed to save you time and money. With our tool, you won't have to manually do this work anymore.
618                </p>
619            </li>
620        </ul>
621
622        <blockquote class="flex flex-col items-center">
623    <p class="max-w-4xl text-xl font-medium text-center md:text-2xl lg:text-3xl text-quoted">Adding PreviewLinks to the Tenancy documentation was super straightforward. Now all pages have a
624                beautiful preview on social media, with no extra work</p>
625
626    <footer class="flex items-center gap-3 mt-6 md:mt-12">
627        <img
628            class="flex-shrink-0 w-12 h-12 border rounded-full border-black/10"
629            src="https://previewlinks.io/assets/testimonials/samuel.png"
630            alt="Samuel Å tancl"
631            loading="lazy"
632        >
633
634        <a
635            href="http://archte.ch/?ref=previewlinks.io"
636            target="_blank"
637            class="inline-block font-bold tracking-tight"
638        >
639            <p>Samuel Å tancl</p>
640            <p class="font-medium text-black/60">Founder of ArchTech</p>
641        </a>
642    </footer>
643</blockquote>
644    </div>
645</section>
646    <hr class="relative w-full mx-auto border-t max-w-7xl border-black/5" />
647    <section class="my-12 md:my-24">
648        <div class="container space-y-12 md:space-y-24">
649            <header class="flex flex-col items-start">
650    <p class="md:text-xl font-bold tracking-tight text-mango">The editor</p>
651
652    <h2 class="max-w-4xl mt-6 text-3xl font-bold tracking-tighter md:text-5xl lg:text-6xl">
653        Design made easy.
654
655                    <span class="block text-black/40">
656                Create templates without the need of a designer.
657            </span>
658            </h2>
659
660            <p class="max-w-3xl mt-6 text-lg font-medium md:text-xl lg:text-2xl text-black/60">
661            Our editor is easy to use and doesn't require an additional designer in your team to use. We stay on
662                    top of the design trends and provide you customizable layouts.
663        </p>
664    
665    
666</header>
667
668            <div x-data="Tabs({
669                activeClass: 'text-white drop-shadow'
670            })">
671                <nav class="relative overflow-auto">
672                    <div
673                        class="absolute h-10 transition-all duration-300 rounded-full bg-mango"
674                        x-ref="indicator"
675                    ></div>
676
677                    <ul
678                        class="relative flex items-center gap-2 flex-nowrap"
679                        x-ref="buttons"
680                    >
681                                                    <li class="flex-shrink-0">
682                                <button
683                                    class="inline-block px-4 py-2 font-bold tracking-tight transition duration-300 rounded-full hover:bg-black/5"
684                                    x-bind="button(0)"
685                                >Design</button>
686                            </li>
687                                                    <li class="flex-shrink-0">
688                                <button
689                                    class="inline-block px-4 py-2 font-bold tracking-tight transition duration-300 rounded-full hover:bg-black/5"
690                                    x-bind="button(1)"
691                                >Playground</button>
692                            </li>
693                                                    <li class="flex-shrink-0">
694                                <button
695                                    class="inline-block px-4 py-2 font-bold tracking-tight transition duration-300 rounded-full hover:bg-black/5"
696                                    x-bind="button(2)"
697                                >Integrate</button>
698                            </li>
699                                                    <li class="flex-shrink-0">
700                                <button
701                                    class="inline-block px-4 py-2 font-bold tracking-tight transition duration-300 rounded-full hover:bg-black/5"
702                                    x-bind="button(3)"
703                                >Share</button>
704                            </li>
705                                            </ul>
706                </nav>
707
708                <figure class="p-6 mt-6 rounded-xl bg-mango">
709                    <video
710                        class="object-cover aspect-[20/11] w-full h-full rounded-md shadow-xl ring-1 ring-black/10 shadow-black/10"
711                        autoplay
712                        muted
713                        loop
714                        x-bind:src="JSON.parse('[\u0022https:\\\/\\\/previewlinks.io\\\/assets\\\/videos\\\/design.mp4\u0022,\u0022https:\\\/\\\/previewlinks.io\\\/assets\\\/videos\\\/playground.mp4\u0022,\u0022https:\\\/\\\/previewlinks.io\\\/assets\\\/videos\\\/integrate.mp4\u0022,\u0022https:\\\/\\\/previewlinks.io\\\/assets\\\/videos\\\/share.mp4\u0022]')[activeIndex]"
715                    ></video>
716                </figure>
717            </div>
718
719            <blockquote class="flex flex-col items-center">
720    <p class="max-w-4xl text-xl font-medium text-center md:text-2xl lg:text-3xl text-quoted">PreviewLinks made it possible to create the most beautiful previews with little design experience,
721                    integrating it with my website
722                    was incredibly simple</p>
723
724    <footer class="flex items-center gap-3 mt-6 md:mt-12">
725        <img
726            class="flex-shrink-0 w-12 h-12 border rounded-full border-black/10"
727            src="https://previewlinks.io/assets/testimonials/sebastiaan.jpeg"
728            alt="Sebastiaan Kloos"
729            loading="lazy"
730        >
731
732        <a
733            href="https://codecycler.dev?ref=previewlinks.io"
734            target="_blank"
735            class="inline-block font-bold tracking-tight"
736        >
737            <p>Sebastiaan Kloos</p>
738            <p class="font-medium text-black/60">Founder of Codecycler</p>
739        </a>
740    </footer>
741</blockquote>
742        </div>
743    </section>
744
745    <section class="py-12 md:py-24 bg-candy">
746        <div class="container space-y-12 md:space-y-24">
747            <header class="flex flex-col items-start">
748    <p class="md:text-xl font-bold tracking-tight text-black/75">Integrate</p>
749
750    <h2 class="max-w-4xl mt-6 text-3xl font-bold tracking-tighter md:text-5xl lg:text-6xl">
751        Automate everything.
752
753                    <span class="block text-black/40">
754                From WordPress to Next.js.
755            </span>
756            </h2>
757
758            <p class="max-w-3xl mt-6 text-lg font-medium md:text-xl lg:text-2xl text-black/60">
759            Let your users select sites and templates from their CMS, and load data into their templates. Setup
760                    once,
761                    automate forever.
762        </p>
763    
764    <a
765                    class="mt-6 button md:button-large button-white"
766                    href="https://previewlinks.io/integrations"
767                >Browse integrations</a>
768</header>
769
770            <div
771    x-data="Tabs({
772        activeClass: 'text-black drop-shadow'
773    })"
774    class="overflow-hidden text-white bg-black shadow-xl rounded-xl ring-1 ring-black/5 shadow-black/10"
775>
776    <nav class="relative p-2">
777        <div
778            class="absolute h-10 transition-all duration-300 rounded-full bg-candy"
779            x-ref="indicator"
780        ></div>
781
782        <ul
783            class="relative flex items-center gap-2"
784            x-ref="buttons"
785        >
786                            <li>
787                    <button
788                        class="inline-block px-4 py-2 font-bold tracking-tight duration-300 rounded-full transtion hover:bg-white/10"
789                        x-bind="button(0)"
790                    >Node.js</button>
791                </li>
792                            <li>
793                    <button
794                        class="inline-block px-4 py-2 font-bold tracking-tight duration-300 rounded-full transtion hover:bg-white/10"
795                        x-bind="button(1)"
796                    >HTML</button>
797                </li>
798                            <li>
799                    <button
800                        class="inline-block px-4 py-2 font-bold tracking-tight duration-300 rounded-full transtion hover:bg-white/10"
801                        x-bind="button(2)"
802                    >PHP</button>
803                </li>
804                            <li>
805                    <button
806                        class="inline-block px-4 py-2 font-bold tracking-tight duration-300 rounded-full transtion hover:bg-white/10"
807                        x-bind="button(3)"
808                    >Next.js</button>
809                </li>
810                    </ul>
811    </nav>
812
813    <div class="border-t border-white/10">
814        <ul class="p-6 overflow-auto">
815                            <li x-bind="content(0)">
816                    <pre><code><pre class="shiki" style="background-color: #0d1117"><code><span class="line"><span style="color: #FF7B72">const</span><span style="color: #C9D1D9"> { </span><span style="color: #79C0FF">PreviewLinks</span><span style="color: #C9D1D9"> } </span><span style="color: #FF7B72">=</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">require</span><span style="color: #C9D1D9">(</span><span style="color: #A5D6FF">&#39;@previewlinks/node-preview-links&#39;</span><span style="color: #C9D1D9">)</span></span>
817<span class="line"></span>
818<span class="line"><span style="color: #FF7B72">const</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">previewLinks</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">=</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">new</span><span style="color: #C9D1D9"> </span><span style="color: #D2A8FF">PreviewLinks</span><span style="color: #C9D1D9">({ apiToken: </span><span style="color: #A5D6FF">&#39;&lt;YOUR_API_TOKEN&gt;&#39;</span><span style="color: #C9D1D9"> })</span></span>
819<span class="line"></span>
820<span class="line"><span style="color: #FF7B72">const</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">url</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">=</span><span style="color: #C9D1D9"> previewLinks.</span><span style="color: #D2A8FF">signedImageUrl</span><span style="color: #C9D1D9">({</span></span>
821<span class="line"><span style="color: #C9D1D9">    siteId: </span><span style="color: #79C0FF">167</span><span style="color: #C9D1D9">,</span></span>
822<span class="line"><span style="color: #C9D1D9">    templateId: </span><span style="color: #79C0FF">234</span><span style="color: #C9D1D9">,</span></span>
823<span class="line"><span style="color: #C9D1D9">    fields: {</span></span>
824<span class="line"><span style="color: #C9D1D9">        </span><span style="color: #A5D6FF">&#39;previewlinks:title&#39;</span><span style="color: #C9D1D9">: </span><span style="color: #A5D6FF">&#39;Hello from Node.js!&#39;</span><span style="color: #C9D1D9">,</span></span>
825<span class="line"><span style="color: #C9D1D9">        </span><span style="color: #A5D6FF">&#39;previewlinks:subtitle&#39;</span><span style="color: #C9D1D9">: </span><span style="color: #A5D6FF">&#39;This is an example...&#39;</span><span style="color: #C9D1D9">,</span></span>
826<span class="line"><span style="color: #C9D1D9">    },</span></span>
827<span class="line"><span style="color: #C9D1D9">})</span></span>
828<span class="line"></span></code></pre></code></pre>
829                </li>
830                            <li x-bind="content(1)">
831                    <pre><code><pre class="shiki" style="background-color: #0d1117"><code><span class="line"><span style="color: #C9D1D9">&lt;!</span><span style="color: #7EE787">DOCTYPE</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">html</span><span style="color: #C9D1D9">&gt;</span></span>
832<span class="line"><span style="color: #C9D1D9">&lt;</span><span style="color: #7EE787">html</span><span style="color: #C9D1D9">&gt;</span></span>
833<span class="line"><span style="color: #C9D1D9">    &lt;</span><span style="color: #7EE787">head</span><span style="color: #C9D1D9">&gt;</span></span>
834<span class="line"><span style="color: #C9D1D9">        &lt;</span><span style="color: #7EE787">meta</span></span>
835<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">property</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;og:image&quot;</span></span>
836<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">content</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;https://previewlinks.io/generate/templates/719/meta?url=https://example.com&quot;</span></span>
837<span class="line"><span style="color: #C9D1D9">        /&gt;</span></span>
838<span class="line"></span>
839<span class="line"><span style="color: #C9D1D9">        &lt;</span><span style="color: #7EE787">meta</span></span>
840<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">name</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;twitter:image&quot;</span></span>
841<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">content</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;https://previewlinks.io/generate/templates/719/meta?url=https://example.com&quot;</span></span>
842<span class="line"><span style="color: #C9D1D9">        /&gt;</span></span>
843<span class="line"></span>
844<span class="line"><span style="color: #C9D1D9">        &lt;</span><span style="color: #7EE787">meta</span></span>
845<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">name</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;previewlinks:title&quot;</span></span>
846<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">content</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;Finally, a scheduling tool that just works&quot;</span></span>
847<span class="line"><span style="color: #C9D1D9">        /&gt;</span></span>
848<span class="line"></span>
849<span class="line"><span style="color: #C9D1D9">        &lt;</span><span style="color: #7EE787">meta</span></span>
850<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">name</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;previewlinks:image&quot;</span></span>
851<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #79C0FF">content</span><span style="color: #C9D1D9">=</span><span style="color: #A5D6FF">&quot;https://previewlinks.io/assets/logo.svg&quot;</span></span>
852<span class="line"><span style="color: #C9D1D9">        /&gt;</span></span>
853<span class="line"><span style="color: #C9D1D9">    &lt;/</span><span style="color: #7EE787">head</span><span style="color: #C9D1D9">&gt;</span></span>
854<span class="line"><span style="color: #C9D1D9">&lt;/</span><span style="color: #7EE787">html</span><span style="color: #C9D1D9">&gt;</span></span>
855<span class="line"></span></code></pre></code></pre>
856                </li>
857                            <li x-bind="content(2)">
858                    <pre><code><pre class="shiki" style="background-color: #0d1117"><code><span class="line"><span style="color: #FF7B72">&lt;?</span><span style="color: #79C0FF">php</span></span>
859<span class="line"></span>
860<span class="line"><span style="color: #FF7B72">
860use</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">PreviewLinks\PreviewLinks</span><span style="color: #C9D1D9">;</span></span>
861<span class="line"></span>
862<span class="line"><span style="color: #C9D1D9">$previewLinks </span><span style="color: #FF7B72">=</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">new</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">PreviewLinks</span><span style="color: #C9D1D9">(</span><span style="color: #A5D6FF">&#39;&lt;YOUR_SITE_API_KEY&gt;&#39;</span><span style="color: #C9D1D9">);</span></span>
863<span class="line"></span>
864<span class="line"><span style="color: #C9D1D9">$url </span><span style="color: #FF7B72">=</span><span style="color: #C9D1D9"> $previewLinks</span><span style="color: #FF7B72">-&gt;</span><span style="color: #D2A8FF">asyncImage</span><span style="color: #C9D1D9">(</span></span>
865<span class="line"><span style="color: #C9D1D9">    </span><span style="color: #FFA657">templateId</span><span style="color: #C9D1D9">: </span><span style="color: #79C0FF">163</span><span style="color: #C9D1D9">,</span></span>
866<span class="line"><span style="color: #C9D1D9">    </span><span style="color: #FFA657">fields</span><span style="color: #C9D1D9">: [</span></span>
867<span class="line"><span style="color: #C9D1D9">        </span><span style="color: #A5D6FF">&#39;previewlinks:title&#39;</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">=&gt;</span><span style="color: #C9D1D9"> </span><span style="color: #A5D6FF">&#39;Hello from PHP SDK&#39;</span><span style="color: #C9D1D9">,</span></span>
868<span class="line"><span style="color: #C9D1D9">    ],</span></span>
869<span class="line"><span style="color: #C9D1D9">);</span></span>
870<span class="line"></span>
871<span class="line"><span style="color: #FF7B72">return</span><span style="color: #C9D1D9"> </span><span style="color: #A5D6FF">&lt;&lt;&lt;</span><span style="color: #FF7B72">HTML</span></span>
872<span class="line"><span style="color: #A5D6FF">    &lt;</span><span style="color: #7EE787">meta</span><span style="color: #A5D6FF"> </span><span style="color: #79C0FF">name</span><span style="color: #A5D6FF">=</span><span style="color: #A5D6FF">&quot;twitter:image&quot;</span><span style="color: #A5D6FF"> </span><span style="color: #79C0FF">content</span><span style="color: #A5D6FF">=</span><span style="color: #A5D6FF">&quot;{$url}&quot;</span><span style="color: #A5D6FF"> /&gt;</span></span>
873<span class="line"><span style="color: #FF7B72">HTML</span><span style="color: #C9D1D9">;</span></span>
874<span class="line"></span></code></pre></code></pre>
875                </li>
876                            <li x-bind="content(3)">
877                    <pre><code><pre class="shiki" style="background-color: #0d1117"><code><span class="line"><span style="color: #FF7B72">export</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">async</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">function</span><span style="color: #C9D1D9"> </span><span style="color: #D2A8FF">getServerSideProps</span><span style="color: #C9D1D9">(</span><span style="color: #FFA657">context</span><span style="color: #C9D1D9">) {</span></span>
878<span class="line"><span style="color: #C9D1D9">    </span><span style="color: #FF7B72">const</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">preview</span><span style="color: #C9D1D9"> </span><span style="color: #FF7B72">=</span><span style="color: #C9D1D9"> previewLinks.</span><span style="color: #D2A8FF">signedImageUrl</span><span style="color: #C9D1D9">({</span></span>
879<span class="line"><span style="color: #C9D1D9">        siteId: </span><span style="color: #79C0FF">167</span><span style="color: #C9D1D9">,</span></span>
880<span class="line"><span style="color: #C9D1D9">        templateId: </span><span style="color: #79C0FF">234</span><span style="color: #C9D1D9">,</span></span>
881<span class="line"><span style="color: #C9D1D9">        fields: {</span></span>
882<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #A5D6FF">&#39;previewlinks:title&#39;</span><span style="color: #C9D1D9">: </span><span style="color: #A5D6FF">&#39;Hello from Node.js!&#39;</span><span style="color: #C9D1D9">,</span></span>
883<span class="line"><span style="color: #C9D1D9">            </span><span style="color: #A5D6FF">&#39;previewlinks:subtitle&#39;</span><span style="color: #C9D1D9">: </span><span style="color: #A5D6FF">&#39;This is an example...&#39;</span><span style="color: #C9D1D9">,</span></span>
884<span class="line"><span style="color: #C9D1D9">        },</span></span>
885<span class="line"><span style="color: #C9D1D9">    })</span></span>
886<span class="line"></span>
887<span class="line"><span style="color: #C9D1D9">    </span><span style="color: #FF7B72">return</span><span style="color: #C9D1D9"> {</span></span>
888<span class="line"><span style="color: #C9D1D9">        props: { preview },</span></span>
889<span class="line"><span style="color: #C9D1D9">    }</span></span>
890<span class="line"><span style="color: #C9D1D9">}</span></span>
891<span class="line"></span>
892<span class="line"><span style="color: #FF7B72">export</span><span style="color: #FFA657"> </span><span style="color: #FF7B72">default</span><span style="color: #FFA657"> </span><span style="color: #FF7B72">function</span><span style="color: #FFA657"> </span><span style="color: #D2A8FF">Home</span><span style="color: #FFA657">({ preview }) </span><span style="color: #C9D1D9">
892{</span></span>
893<span class="line"><span style="color: #C9D1D9">    </span><span style="color: #FF7B72">return</span><span style="color: #C9D1D9"> (</span></span>
894<span class="line"><span style="color: #C9D1D9">        &lt;</span><span style="color: #7EE787">Head</span><span style="color: #C9D1D9">&gt;</span></span>
895<span class="line"><span style="color: #C9D1D9">            &lt;</span><span style="color: #7EE787">meta</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">name</span><span style="color: #FF7B72">=</span><span style="color: #A5D6FF">&quot;twitter:card&quot;</span><span style="color: #C9D1D9"> </span><span style="color: #79C0FF">content</span><span style="color: #FF7B72">=</span><span style="color: #C9D1D9">{preview} /&gt;</span></span>
896<span class="line"><span style="color: #C9D1D9">        &lt;/</span><span style="color: #7EE787">Head</span><span style="color: #C9D1D9">&gt;</span></span>
897<span class="line"><span style="color: #C9D1D9">    )</span></span>
898<span class="line"><span style="color: #C9D1D9">}</span></span>
899<span class="line"></span></code></pre></code></pre>
900                </li>
901                    </ul>
902    </div>
903</div>
904
905            <blockquote class="flex flex-col items-center">
906    <p class="max-w-4xl text-xl font-medium text-center md:text-2xl lg:text-3xl text-quoted">It took me less than five minutes to get PreviewLinks up and running. It's incredibly easy to use and
907                    at the price, it's a no-brainer</p>
908
909    <footer class="flex items-center gap-3 mt-6 md:mt-12">
910        <img
911            class="flex-shrink-0 w-12 h-12 border rounded-full border-black/10"
912            src="https://previewlinks.io/assets/testimonials/aaron.jpeg"
913            alt="Aaron"
914            loading="lazy"
915        >
916
917        <a
918            href="https://hammerstone.dev/?ref=previewlinks.io"
919            target="_blank"
920            class="inline-block font-bold tracking-tight"
921        >
922            <p>Aaron</p>
923            <p class="font-medium text-black/60">Cofounder of Hammerstone</p>
924        </a>
925    </footer>
926</blockquote>
927        </div>
928    </section>
929
930    <section
931        class="my-12 md:my-24 scroll-mt-40"
932        id="pricing"
933    >
934        <div class="container space-y-12 md:space-y-24">
935            <header class="flex flex-col items-start">
936    <p class="md:text-xl font-bold tracking-tight text-floral">Pricing</p>
937
938    <h2 class="max-w-4xl mt-6 text-3xl font-bold tracking-tighter md:text-5xl lg:text-6xl">
939        Automate link previews today.
940
941                    <span class="block text-black/40">
942                No credit card required.
943            </span>
944            </h2>
945
946    
947    
948</header>
949
950            <footer
951                class="flex flex-col items-center"
952                x-data="Tabs({
953                    activeClass: 'text-white drop-shadow'
954                })"
955            >
956
957                <div class="relative inline-block rounded-full bg-gray-50">
958                    <div
959                        x-ref="indicator"
960                        class="absolute inset-y-0 transition-all duration-300 rounded-full bg-floral"
961                    ></div>
962
963                    <nav
964                        class="inline-grid grid-cols-2 gap-0.5"
965                        x-ref="buttons"
966                    >
967                        <button
968                            x-bind="button(0)"
969                            class="inline-block px-4 py-2 font-bold tracking-tight transition duration-300 rounded-full hover:bg-black/5"
970                        >Monthly</button>
971
972                        <button
973                            x-bind="button(1)"
974                            class="inline-block px-4 py-2 font-bold tracking-tight transition duration-300 rounded-full hover:bg-black/5"
975                        >Yearly</button>
976                    </nav>
977                </div>
978
979                <ul
980                    class="grid gap-6 mt-6 md:gap-12 md:grid-cols-3"
981                    x-bind="content(0)"
982                >
983                                            <li class="p-6 shadow-xl rounded-xl ring-1 ring-black/5 shadow-black/10">
984    <h3 class="font-bold tracking-tight text-floral">Starter</h3>
985
986    <p class="mt-6 text-4xl font-bold tracking-tighter">$5</p>
987
988    <p class="mt-3 text-black/60">
989        For small businesses that want to automate their link previews and start growing.
990    </p>
991
992    <a class="flex mt-3 button-small button button-secondary-black" href="https://previewlinks.io/app/register">Try 7 days for free</a>
993
994    <ul class="mt-6 space-y-1.5">
995                    <li class="flex items-center gap-1.5 font-medium">
996                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
997                    viewBox="0 0 24 24" stroke="currentColor">
998                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
999                </svg>
1000
1001                <span>10 Sites</span>
1002            </li>
1003                    <li class="flex items-center gap-1.5 font-medium">
1004                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1005                    viewBox="0 0 24 24" stroke="currentColor">
1006                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1007                </svg>
1008
1009                <span>50 Templates</span>
1010            </li>
1011                    <li class="flex items-center gap-1.5 font-medium">
1012                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1013                    viewBox="0 0 24 24" stroke="currentColor">
1014                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1015                </svg>
1016
1017                <span>250 Images per month</span>
1018            </li>
1019                    <li class="flex items-center gap-1.5 font-medium">
1020                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1021                    viewBox="0 0 24 24" stroke="currentColor">
1022                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1023                </svg>
1024
1025                <span>Full API access</span>
1026            </li>
1027            </ul>
1028</li>
1029                                            <li class="p-6 shadow-xl rounded-xl ring-1 ring-black/5 shadow-black/10">
1030    <h3 class="font-bold tracking-tight text-floral">Pro</h3>
1031
1032    <p class="mt-6 text-4xl font-bold tracking-tighter">$14</p>
1033
1034    <p class="mt-3 text-black/60">
1035        For professional businesses that require automation for scaling their link previews.
1036    </p>
1037
1038    <a class="flex mt-3 button-small button button-secondary-black" href="https://previewlinks.io/app/register">Try 7 days for free</a>
1039
1040    <ul class="mt-6 space-y-1.5">
1041                    <li class="flex items-center gap-1.5 font-medium">
1042                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1043                    viewB
1043ox="0 0 24 24" stroke="currentColor">
1044                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1045                </svg>
1046
1047                <span>50 Sites</span>
1048            </li>
1049                    <li class="flex items-center gap-1.5 font-medium">
1050                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1051                    viewBox="0 0 24 24" stroke="currentColor">
1052                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1053                </svg>
1054
1055                <span>100 Templates</span>
1056            </li>
1057                    <li class="flex items-center gap-1.5 font-medium">
1058                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1059                    viewBox="0 0 24 24" stroke="currentColor">
1060                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1061                </svg>
1062
1063                <span>1000 Images per month</span>
1064            </li>
1065                    <li class="flex items-center gap-1.5 font-medium">
1066                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1067                    viewBox="0 0 24 24" stroke="currentColor">
1068                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1069                </svg>
1070
1071                <span>Full API access</span>
1072            </li>
1073            </ul>
1074</li>
1075                                            <li class="p-6 shadow-xl rounded-xl ring-1 ring-black/5 shadow-black/10">
1076    <h3 class="font-bold tracking-tight text-floral">Business</h3>
1077
1078    <p class="mt-6 text-4xl font-bold tracking-tighter">$29</p>
1079
1080    <p class="mt-3 text-black/60">
1081        For large organizations that require high volume automation for their link previews.
1082    </p>
1083
1084    <a class="flex mt-3 button-small button button-secondary-black" href="https://previewlinks.io/app/register">Try 7 days for free</a>
1085
1086    <ul class="mt-6 space-y-1.5">
1087                    <li class="flex items-center gap-1.5 font-medium">
1088                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1089                    viewBox="0 0 24 24" stroke="currentColor">
1090                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1091                </svg>
1092
1093                <span>10000 Sites</span>
1094            </li>
1095                    <li class="flex items-center gap-1.5 font-medium">
1096                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1097                    viewBox="0 0 24 24" stroke="currentColor">
1098                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1099                </svg>
1100
1101                <span>10000 Templates</span>
1102            </li>
1103                    <li class="flex items-center gap-1.5 font-medium">
1104                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1105                    viewBox="0 0 24 24" stroke="currentColor">
1106                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1107                </svg>
1108
1109                <span>10000 Images per month</span>
1110            </li>
1111                    <li class="flex items-center gap-1.5 font-medium">
1112                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1113                    viewBox="0 0 24 24" stroke="currentColor">
1114                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1115                </svg>
1116
1117                <span>Full API access</span>
1118            </li>
1119            </ul>
1120</li>
1121                                    </ul>
1122
1123                <ul
1124                    class="grid gap-6 mt-6 md:gap-12 md:grid-cols-3"
1125                    x-bind="content(1)"
1126                    x-cloak
1127                >
1128                                            <li class="p-6 shadow-xl rounded-xl ring-1 ring-black/5 shadow-black/10">
1129    <h3 class="font-bold tracking-tight text-floral">Starter</h3>
1130
1131    <p class="mt-6 text-4xl font-bold tracking-tighter">$50</p>
1132
1133    <p class="mt-3 text-black/60">
1134        For small businesses that want to automate their link previews and start growing.
1135    </p>
1136
1137    <a class="flex mt-3 button-small button button-secondary-black" href="https://previewlinks.io/app/register">Try 7 days for free</a>
1138
1139    <ul class="mt-6 space-y-1.5">
1140                    <li class="flex items-center gap-1.5 font-medium">
1141                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1142                    viewBox="0 0 24 24" stroke="currentColor">
1143                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1144                </svg>
1145
1146                <span>10 Sites</span>
1147            </li>
1148                    <li class="flex items-center gap-1.5 font-medium">
1149                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1150                    viewBox="0 0 24 24" stroke="currentColor">
1151                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1152                </svg>
1153
1154                <span>50 Templates</span>
1155            </li>
1156                    <li class="flex items-center gap-1.5 font-medium">
1157                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1158                    viewBox="0 0 24 24" stroke="currentColor">
1159                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1160                </svg>
1161
1162                <span>250 Images per month</span>
1163            </li>
1164                    <li class="flex items-center gap-1.5 font-medium">
1165                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1166                    viewBox="0 0 24 24" stroke="currentColor">
1167                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1168                </svg>
1169
1170                <span>Full API access</span>
1171            </li>
1172            </ul>
1173</li>
1174                                            <li class="p-6 shadow-xl rounded-xl ring-1 ring-black/5 shadow-black/10">
1175    <h3 class="font-bold tracking-tight text-floral">Pro</h3>
1176
1177    <p class="mt-6 text-4xl font-bold tracking-tighter">$140</p>
1178
1179    <p class="mt-3 text-black/60">
1180        For professional businesses that require automation for scaling their link previews.
1181    </p>
1182
1183    <a class="flex mt-3 button-small button button-secondary-black" href="https://previewlinks.io/app/register">Try 7 days for free</a>
1184
1185    <ul class="mt-6 space-y-1.5">
1186                    <li class="flex items-center gap-1.5 font-medium">
1187                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1188                    viewB
1188ox="0 0 24 24" stroke="currentColor">
1189                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1190                </svg>
1191
1192                <span>50 Sites</span>
1193            </li>
1194                    <li class="flex items-center gap-1.5 font-medium">
1195                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1196                    viewBox="0 0 24 24" stroke="currentColor">
1197                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1198                </svg>
1199
1200                <span>100 Templates</span>
1201            </li>
1202                    <li class="flex items-center gap-1.5 font-medium">
1203                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1204                    viewBox="0 0 24 24" stroke="currentColor">
1205                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1206                </svg>
1207
1208                <span>1000 Images per month</span>
1209            </li>
1210                    <li class="flex items-center gap-1.5 font-medium">
1211                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1212                    viewBox="0 0 24 24" stroke="currentColor">
1213                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1214                </svg>
1215
1216                <span>Full API access</span>
1217            </li>
1218            </ul>
1219</li>
1220                                            <li class="p-6 shadow-xl rounded-xl ring-1 ring-black/5 shadow-black/10">
1221    <h3 class="font-bold tracking-tight text-floral">Business</h3>
1222
1223    <p class="mt-6 text-4xl font-bold tracking-tighter">$290</p>
1224
1225    <p class="mt-3 text-black/60">
1226        For large organizations that require high volume automation for their link previews.
1227    </p>
1228
1229    <a class="flex mt-3 button-small button button-secondary-black" href="https://previewlinks.io/app/register">Try 7 days for free</a>
1230
1231    <ul class="mt-6 space-y-1.5">
1232                    <li class="flex items-center gap-1.5 font-medium">
1233                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1234                    viewBox="0 0 24 24" stroke="currentColor">
1235                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1236                </svg>
1237
1238                <span>10000 Sites</span>
1239            </li>
1240                    <li class="flex items-center gap-1.5 font-medium">
1241                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1242                    viewBox="0 0 24 24" stroke="currentColor">
1243                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1244                </svg>
1245
1246                <span>10000 Templates</span>
1247            </li>
1248                    <li class="flex items-center gap-1.5 font-medium">
1249                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1250                    viewBox="0 0 24 24" stroke="currentColor">
1251                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1252                </svg>
1253
1254                <span>10000 Images per month</span>
1255            </li>
1256                    <li class="flex items-center gap-1.5 font-medium">
1257                <svg xmlns="http://www.w3.org/2000/svg" class="flex-shrink-0 w-5 h-5 text-floral" fill="none"
1258                    viewBox="0 0 24 24" stroke="currentColor">
1259                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
1260                </svg>
1261
1262                <span>Full API access</span>
1263            </li>
1264            </ul>
1265</li>
1266                                    </ul>
1267            </footer>
1268        </div>
1269    </section>
1270
1271        <footer class="py-12 mt-auto text-white bg-black">
1272            <div class="container">
1273                <div class="grid lg:grid-cols-[1fr,auto] gap-12">
1274                    <section>
1275                        <a
1276                            target="_blank"
1277                            href="https://twitter.com/realCodeCraft"
1278                            class="inline-flex items-center gap-2 font-bold tracking-tight"
1279                        >
1280                            <svg
1281                                class="h-5"
1282                                xmlns="http://www.w3.org/2000/svg"
1283                                viewBox="0 0 277 320"
1284                            >
1285                                <path
1286                                    d="M276.958 109.946v100.62l-94.395 54.454-86.612-49.789 54.457-31.635 40.453-23.336-9.854-5.705-94.39-54.979h-.52V0l182.045 104.767 8.816 5.179ZM0 50.307v219.905L86.097 320V100.095L0 50.307Z"
1287                                    fill="currentColor"
1288                                />
1289                            </svg>
1290
1291                            <span>by Craft Enterprises</span>
1292                        </a>
1293
1294                        <p class="mt-4 text-white/75">&copy; 2026</p>
1295                    </section>
1296
1297                    <ul class="grid items-start grid-cols-2 gap-12 md:grid-cols-4">
1298                        <li>
1299                            <h2 class="font-bold tracking-tight">Pages</h2>
1300
1301                            <ul class="mt-4 space-y-1.5 text-white/75">
1302                                <li>
1303                                    <a
1304                                        class="transition hover:opacity-60"
1305                                        href="https://previewlinks.io"
1306                                    >Home</a>
1307                                </li>
1308
1309                                <li>
1310                                    <a
1311                                        class="transition hover:opacity-60"
1312                                        href="https://previewlinks.io/check-your-preview"
1313                                    >Check your preview</a>
1314                                </li>
1315
1316                                <li>
1317                                    <a
1318                                        class="transition hover:opacity-60"
1319                                        href="https://previewlinks.io/integrations"
1320                                    >Integrations</a>
1321                                </li>
1322
1323                                <li>
1324                                    <a
1325                                        class="transition hover:opacity-60"
1326                                        href="https://previewlinks.io/documentation"
1327                                    >Documentation</a>
1328                                </li>
1329
1330                                <li>
1331                                    <a
1332                                        class="transition hover:opacity-60"
1333                                        href="https://previewlinks.io/pricing"
1334                                    >Pricing</a>
1335                                </li>
1336                            </ul>
1337                        </li>
1338
1339                        <li>
1340                            <h2 class="font-bold tracking-tight">Integrations</h2>
1341
1342                            <ul class="mt-4 space-y-1.5 text-white/75">
1343                                                                    <li>
1344                                        <a
1345                                            class="transition hover:opacity-60"
1346                                            href="https://previewlinks.io/integrations/nodejs"
1347                                        >Node.js</a>
1348                                    </li>
1349                                                                    <li>
1350                                        <a
1351                                            class="transition hover:opacity-60"
1352                                            href="https://previewlinks.io/integrations/nextjs"
1353                                        >Next.js</a>
1354                                    </li>
1355                                                                    <li>
1356                                        <a
1357                                            class="transition hover:opacity-60"
1358                                            href="https://previewlinks.io/integrations/laravel"
1359                                        >Laravel</a>
1360                                    </li>
1361                                                            </ul>
1362                        </li>
1363
1364                        
1365
1366                        <li>
1367                            <h2 class="font-bold tracking-tight">Company</h2>
1368
1369                            <ul class="mt-4 space-y-1.5 text-white/75">
1370                                <li>
1371                                    <a
1372                                        class="transition hover:opacity-60"
1373                                        href="https://previewlinks.io/about"
1374                                    >About</a>
1375                                </li>
1376
1377                                <li>
1378                                    <a
1379                                        class="transition hover:opacity-60"
1380                                        href="https://previewlinks.io/blog"
1381                                    >Blog</a>
1382                                </li>
1383
1384                                <li>
1385                                    <a
1386                                        class="transition hover:opacity-60"
1387                                        href="https://previewlinks.io/privacy"
1388                                    >Privacy</a>
1389                                </li>
1390
1391                                <li>
1392                                    <a
1393                                        class="transition hover:opacity-60"
1394                                        href="https://previewlinks.io/terms-of-service"
1395                                    >Terms of service</a>
1396                                </li>
1397                            </ul>
1398                        </li>
1399                    </ul>
1400                </div>
1401            </div>
1402        </footer>
1403    </div>
1404</body>
1405</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.