https://screenshotone.com/

掃描 ID：
eeff8252-be78-4ff0-b774-cbd1df5e6bfc已完成
已提交的 URL：
https://screenshotone.com/
報告完成時間：

連結 · 找到 7 個

從頁面中識別的傳出連結

連結Text
https://x.com/ScreenshotOneHQX
https://www.producthunt.com/products/screenshotoneProduct Hunt
https://github.com/screenshotoneGitHub
https://www.linkedin.com/company/screenshotoneLinkedIn
https://rapidapi.com/screenshotone-api-screenshotone-api-default/api/screenshotone1 RapidAPI Hub
https://www.sanity.io/plugins/sanity-plugin-asset-source-screenshotone Plugin for Sanity
https://flowmattic.com/integration/screenshotone/ FlowMattic

JavaScript 變數 · 找到 20 個

在頁面的視窗物件上載入的全域 JavaScript 變數是在函數外部宣告的變數，可從目前範圍內程式碼中的任何位置存取

名稱類型
0object
onbeforetoggleobject
documentPictureInPictureobject
onscrollendobject
$crispobject
CRISP_WEBSITE_IDstring
dobject
sobject
posthogobject
$__CRISP_INCLUDEDboolean

主控台記錄訊息 · 找到 2 條

記錄到 Web 主控台的訊息

類型類別記錄
errorsecurity
URL
https://screenshotone.com/
Text
Access to XMLHttpRequest at 'https://ph.screenshotone.com/array/phc_iW83nUdM7AoQzGtU7JbP8xrCvV46BGMlNVTKKFcsJ53/config?ip=1&_=1734540203982&ver=1.201.1' from origin 'https://screenshotone.com' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
errornetwork
URL
https://ph.screenshotone.com/array/phc_iW83nUdM7AoQzGtU7JbP8xrCvV46BGMlNVTKKFcsJ53/config?ip=1&_=1734540203982&ver=1.201.1
Text
Failed to load resource: net::ERR_FAILED

HTML

頁面的原始 HTML 主體

<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta http-equiv="x-ua-compatible" content="ie=edge"><meta name="theme-color" content="#fff"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><link rel="canonical" href="https://screenshotone.com/"><title>The Screenshot API for developers</title><meta name="description" content="ScreenshotOne is the best screenshot rendering platform for developers."><link rel="sitemap" href="/sitemap-index.xml"><meta property="og:locale" content="en_US"><meta property="og:type" content="website"><meta property="og:title" content="The Screenshot API for developers"><meta property="og:description" content="ScreenshotOne is the best screenshot rendering platform for developers."><meta property="og:url" content="https://screenshotone.com/"><meta property="og:site_name" content="ScreenshotOne"><meta property="og:image" content="https://screenshotone.com/og.png"><meta property="og:image:alt" content="ScreenshotOne"><meta name="twitter:card" content="summary_large_image"><meta name="twitter:site" content="@ScreenshotOneHQ"><meta name="twitter:creator" content="@DmytroKrasun"><meta name="twitter:title" content="The Screenshot API for developers"><meta name="twitter:description" content="ScreenshotOne is the best screenshot rendering platform for developers."><meta name="twitter:image" content="https://screenshotone.com/og.png"><meta name="twitter:image:alt" content="The Screenshot API for developers"><script type="text/javascript" async="" src="https://ph.screenshotone.com/static/array.js"></script><script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://screenshotone.com/#/schema/organization/1","name":"ScreenshotOne","url":"https://screenshotone.com/","sameAs":["https://twitter.com/ScreenshotOneHQ","https://www.linkedin.com/company/screenshotone/","https://github.com/screenshotone"],"logo":{"@type":"ImageObject","@id":"https://screenshotone.com/#/schema/image/1","url":"https://screenshotone.com/logo.png","width":48,"height":48,"caption":"ScreenshotOne"},"image":{"@id":"https://screenshotone.com/#/schema/image/1"}},{"@type":"SoftwareApplication","@id":"https://screenshotone.com/#/schema/website/1","url":"https://screenshotone.com/","name":"ScreenshotOne","description":"ScreenshotOne is a fast and reliable screenshot API for rendering website screenshots.","operatingSystem":"All","applicationCategory":"DeveloperApplication","aggregateRating":{"@type":"AggregateRating","ratingValue":"5","ratingCount":"30"},"offers":{"@type":"AggregateOffer","lowPrice":"0","highPrice":"","priceCurrency":"USD"},"review":[{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Mike Roberts"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Sam Shore"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Alex Rainey"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Matthias Neumayer"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Elias Stråvik"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Ilias Ism"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"John Rush"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Bjarn Bronsveld"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Luvian Cotak"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Chris Jayden"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Ben Machek"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Alexandr Bezhan"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Lawrence Alexander"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Gregory Borelli"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Zawwad Ul Sami"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Aleksandar Balalovski"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Justin Phillips"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Sebastian Graz"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Guillaume Barillot"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Lukas Hermann"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Sukh"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Danny Postma"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Rishi Mohan"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Jannis Fedoruk-Betschki"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Tim Wheeler"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Sankeerth Julapally"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Dan Kulkov"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Stefan Wirth"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Beto Vides"}},{"@type":"Review","reviewRating":{"@type":"Rating","ratingValue":"5"},"author":{"@type":"Person","name":"Sergey Karakhanyan"}}],"publisher":{"@id":"https://screenshotone.com/#/schema/organization/1"}},{"@context":"https://schema.org","@graph":[{"@type":"Person","@id":"https://screenshotone.com/#/schema/person/2","name":"Dmytro Krasun","sameAs":["https://twitter.com/DmytroKrasun","https://www.linkedin.com/in/dmytrokrasun","https://github.com/krasun"]}]},{"@context":"https://schema.org","@graph":[{"@type":"ImageObject","@id":"https://screenshotone.com//#/schema/image/2","url":"https://screenshotone.com/og.png","contentUrl":"https://screenshotone.com/og.png","caption":"Better and more extensible PDF rendering"}]},{"@type":"WebPage","@id":"https://screenshotone.com/","url":"https://screenshotone.com/","name":"The Screenshot API for developers","description":"ScreenshotOne is the best screenshot rendering platform for developers.","isPartOf":{"@id":"https://screenshotone.com/#/schema/website/1"},"about":{"@id":"https://screenshotone.com/#/schema/organization/1"},"breadcrumb":{"@id":"https://screenshotone.com/#/schema/breadcrumb/1"},"primaryImageOfPage":{"@id":"https://screenshotone.com/#/schema/image/2"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https://screenshotone.com/"]}]},{"@type":"BreadcrumbList","@id":"https://screenshotone.com/#/schema/breadcrumb/1","name":"Breadcrumbs","itemListElement":[{"@type":"ListItem","position":1,"item":{"@type":"WebPage","@id":"https://screenshotone.com/","url":"https://screenshotone.com/","name":"The Screenshot API"}},{"@type":"ListItem","position":2,"item":{"@type":"WebPage","@id":"https://screenshotone.com/","url":"https://screenshotone.com/","name":"The Screenshot API for developers"}}]}]}</script><meta name="robots" content="index, follow"><meta name="googlebot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1"><meta name="bingbot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1"><link rel="apple-touch-icon" sizes="180x180" href="https://screenshotone.com/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="https://screenshotone.com/favicon-32x32.png"><link rel="icon" type="image/png" sizes="16x16" href="https://screenshotone.com/favicon-16x16.png"><link rel="manifest" crossorigin="use-credentials" href="https://screenshotone.com/site.webmanifest"><link rel="icon" href="/favicon.ico"><script async="" src="https://cdn.tolt.io/tolt.js" data-tolt="fd8471b4-5248-4d88-b73a-34e0921ee5bf"></script> <script type="text/javascript">window.$crisp=[];window.CRISP_WEBSITE_ID="5a81e7a2-2f8b-4104-8e7c-4ca0ce7e5b81";(function(){d=document;s=d.createElement("script");s.src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script><script src="https://client.crisp.chat/l.js" async=""></script> <script defer="" type="text/javascript" src="https://api.pirsch.io/pirsch.js" id="pirschjs" data-code="URKF0kKgDNufWuZ9wNQag7O5FHfM0Fwd"></script> <script>
    !function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.async=!0,p.src=s.api_host+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="capture identify alias people.set people.set_once set_config register register_once unregister opt_out_capturing has_opted_out_capturing opt_in_capturing reset isFeatureEnabled onFeatureFlags getFeatureFlag getFeatureFlagPayload reloadFeatureFlags group updateEarlyAccessFeatureEnrollment getEarlyAccessFeatures getActiveMatchingSurveys getSurveys".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]);
    posthog.init('phc_iW83nUdM7AoQzGtU7JbP8xrCvV46BGMlNVTKKFcsJ53', {api_host: 'https://ph.screenshotone.com'})
</script><link rel="stylesheet" href="/_astro/index.AinS77B5.css">
<link rel="stylesheet" href="/_astro/puppeteer-alternative-for-screenshots.BR2YOVce.css">
<style>[data-astro-image]{width:100%;height:auto;-o-object-fit:var(--fit);object-fit:var(--fit);-o-object-position:var(--pos);object-position:var(--pos);aspect-ratio:var(--w) / var(--h)}[data-astro-image=responsive]{max-width:calc(var(--w) * 1px);max-height:calc(var(--h) * 1px)}[data-astro-image=fixed]{width:calc(var(--w) * 1px);height:calc(var(--h) * 1px)}
</style><script type="module" src="/_astro/page.7qqag-5g.js"></script><link href="https://client.relay.crisp.chat" rel="dns-prefetch" crossorigin=""><link href="https://client.crisp.chat" rel="preconnect" crossorigin=""><script src="https://client.crisp.chat/static/javascripts/client.js?3dd69eb" type="text/javascript" async=""></script><link href="https://client.crisp.chat/static/stylesheets/client_default.css?3dd69eb" type="text/css" rel="stylesheet"><script src="https://cdn.jsdelivr.net/npm/psl/dist/psl.min.js"></script></head> <body> <header class="bg-white"> <nav class="mx-auto flex max-w-7xl items-center justify-between gap-x-6 p-6 lg:px-8" aria-label="Global"> <div class="flex lg:flex-1 items-center gap-x-12"> <a href="/" class="-m-1.5 p-1.5 flex items-center gap-2"> <img class="h-8 w-auto" src="/logo.svg" alt=""> <span class="sr-only sm:not-sr-only text-xl font-logo font-semibold tracking-normal">ScreenshotOne</span> </a> </div> <div class="hidden lg:flex lg:gap-x-12"> <a href="/scrolling-screenshots/" class="text-sm font-semibold leading-6 text-gray-900"> Scrolling Screenshots </a><a href="/pricing/" class="text-sm font-semibold leading-6 text-gray-900"> Pricing </a><a href="/docs/getting-started/" class="text-sm font-semibold leading-6 text-gray-900"> Docs </a><a href="/blog/" class="text-sm font-semibold leading-6 text-gray-900"> Blog </a><a href="/testimonials/" class="text-sm font-semibold leading-6 text-gray-900"> Customers </a> </div> <div class="flex flex-1 items-center justify-end gap-x-6"> <a href="https://dash.screenshotone.com/sign-in" class="anonymous-link hidden lg:block lg:text-sm lg:font-semibold lg:leading-6 lg:text-gray-900">Sign In</a> <a href="https://dash.screenshotone.com" class="authenticated-link hidden lg:block !hidden py-2 lg:text-sm lg:font-semibold lg:leading-6 lg:text-gray-900">Dashboard</a> <a href="https://dash.screenshotone.com/sign-up" class="anonymous-link rounded-md bg-indigo-600 px-3 py-2 lg:leading-6 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Sign Up</a> <a href="/book-a-call" class="anonymous-link rounded-md ring-1 ring-inset lg:leading-6 ring-indigo-600 px-3 py-2 text-sm font-semibold text-indigo-600 shadow-sm hover:bg-indigo-600 hover:text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Book a demo</a> </div> <div class="flex lg:hidden"> <button type="button" class="open-mobile-menu -m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700"> <span class="sr-only">Open main menu</span> <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"></path> </svg> </button> </div> </nav> <!-- Mobile menu, show/hide based on menu open state. --> <div class="mobile-menu lg:hidden" role="dialog" aria-modal="true" style="display: none;"> <!-- Background backdrop, show/hide based on slide-over state. --> <div class="fixed inset-0 z-10"></div> <div class="fixed inset-y-0 right-0 z-10 w-full overflow-y-auto bg-white px-6 py-6 sm:max-w-sm sm:ring-1 sm:ring-gray-900/10"> <div class="flex items-center gap-x-6"> <a href="#" class="-m-1.5 p-1.5"> <span class="sr-only">ScreenshotOne</span> <img class="h-8 w-auto" src="/logo.svg" alt=""> </a> <a href="https://dash.screenshotone.com/sign-up" class="anonymous-link ml-auto rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Sign Up</a> <button type="button" class="close-mobile-menu -m-2.5 rounded-md p-2.5 text-gray-700"> <span class="sr-only">Close menu</span> <svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true"> <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <div class="mt-6 flow-root"> <div class="-my-6 divide-y divide-gray-500/10"> <div class="space-y-2 py-6"> <a href="/scrolling-screenshots/" class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"> Scrolling Screenshots </a><a href="/pricing/" class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"> Pricing </a><a href="/docs/getting-started/" class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"> Docs </a><a href="/blog/" class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"> Blog </a><a href="/testimonials/" class="-mx-3 block rounded-lg px-3 py-2 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50"> Customers </a> </div> <div class="py-6"> <a href="https://dash.screenshotone.com/sign-in" class="anonymous-link -mx-3 block rounded-lg px-3 py-2.5 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">Sign In</a> <a href="https://dash.screenshotone.com/" class="authenticated-link -mx-3 block !hidden rounded-lg px-3 py-2.5 text-base font-semibold leading-7 text-gray-900 hover:bg-gray-50">Dashboard</a> </div> </div> </div> </div> </div> </header> <script type="text/javascript" crossorigin="anonymous" src="https://ph.screenshotone.com/array/phc_iW83nUdM7AoQzGtU7JbP8xrCvV46BGMlNVTKKFcsJ53/config.js"></script><script type="module">document.addEventListener("DOMContentLoaded",()=>{const n=document.querySelector(".mobile-menu");if(!n)return;document.querySelector(".close-mobile-menu")?.addEventListener("click",()=>{n.style.display="none"}),document.querySelector(".open-mobile-menu")?.addEventListener("click",()=>{n.style.display="block"}),fetch("https://dash.screenshotone.com/api/authenticated",{method:"get",credentials:"include"}).then(e=>e.json()).then(e=>{e.authenticated?(document.querySelectorAll(".authenticated-link").forEach(t=>{t.classList.remove("!hidden")}),document.querySelectorAll(".anonymous-link").forEach(t=>{t.classList.add("!hidden")})):(document.querySelectorAll(".authenticated-link").forEach(t=>{t.classList.add("!hidden")}),document.querySelectorAll(".anonymous-link").forEach(t=>{t.classList.remove("!hidden")}))}).catch(()=>{document.querySelectorAll(".authenticated-link").forEach(e=>{e.classList.add("!hidden")}),document.querySelectorAll(".anonymous-link").forEach(e=>{e.classList.remove("!hidden")})})});</script>  <style type="text/css">
        .browser-mockup {
            border-top: 1.5em solid rgba(230, 230, 230, 0.5);
            position: relative;
            border-radius: 6px 6px 0 0;
        }

        .browser-mockup:before {
            display: block;
            position: absolute;
            content: "";
            top: -0.93em;
            left: 1em;
            width: 0.4em;
            height: 0.4em;
            border-radius: 50%;
            background-color: rgb(253, 142, 142);
            box-shadow:
                0 0 0 2px rgb(255, 130, 130),
                1.2em 0 0 2px rgb(203, 219, 155),
                2.4em 0 0 2px rgb(255, 225, 180);
        }

        .browser-mockup > * {
            display: block;
        }
    </style> <div class="mx-auto max-w-7xl px-6 pt-24 lg:flex lg:flex-row lg:justify-between lg:px-8 lg:pt-24"> <div class="mx-auto max-w-2xl lg:mx-0 lg:max-w-xl lg:flex-shrink-0"> <div> <a href="/blog/screenshotone-and-cloudflare/" class="inline-flex space-x-6"> <span class="rounded-full bg-indigo-600/10 px-3 py-1 text-sm font-semibold leading-6 text-indigo-600 ring-1 ring-inset ring-indigo-600/10">What's new</span> <span class="inline-flex items-center space-x-2 text-sm font-medium leading-6 text-gray-600"> <span class="sm:hidden">Featured on Cloudflare</span> <span class="hidden sm:inline">Featured in the Cloudflare "Built With" series</span> <svg class="h-5 w-5 text-gray-400" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z" clip-rule="evenodd"></path> </svg> </span> </a> </div> <h1 class="mt-10 text-4xl font-bold tracking-tight text-gray-900 sm:text-6xl">
The screenshot API for developers
</h1> <p class="mt-6 text-lg leading-8 text-gray-600">
Render screenshots in one simple API call, instead of managing
            browser clusters, and handling all the corner cases.
</p> <div class="mt-10 flex items-center gap-x-6"> <a href="https://dash.screenshotone.com/sign-up" class="rounded-md bg-indigo-600 px-4 py-3 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Start rendering for free →</a> <a href="/book-a-call" class="hidden sm:inline rounded-md ring-1 ring-inset ring-indigo-600 px-4 py-3 text-sm font-semibold text-indigo-600 shadow-sm hover:bg-indigo-600 hover:text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Book a demo</a> </div> <div class="mt-2 text-sm text-gray-700">No credit card required.</div> </div> <div class="mx-auto mt-16 max-w-2xl sm:mt-24 lg:mr-0 lg:mt-0 lg:max-w-none"> <div class="flex flex-col items-center justify-center"> <div class="browser-mockup w-80 sm:w-[400px] h-auto shadow-lg"> <img src="/_astro/stripe.DktQZYtB_2nk9Aw.webp" loading="eager" alt="An example of the Stripe screenshot" width="768" height="480" decoding="async" class="w-full h-auto"> </div> <span class="shadow-purple-200 shadow-lg p-3 rounded text-base hidden lg:inline font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(241, 184, 104)"> <span style="color: rgb(189, 147, 222)">https://api.screenshotone.com/take?</span>url=https://stripe.com
</span> <div class="shadow-purple-200 shadow-lg p-2 rounded text-sm lg:hidden font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(241, 184, 104)"> <span style="color: rgb(189, 147, 222)">https://api.screenshotone.com/take<br>?</span>url=https://stripe.com
</div> </div> </div> </div> <div class="mx-auto max-w-7xl px-6 pt-24 md:flex md:flex-row md:justify-between md:items-center md:px-8 md:pt-24"> <div class="block text-center md:w-auto"> <div class="flex flex-row items-center justify-center gap-x-4 flex-1"> <div class="size-16"> <img src="/_astro/guillaume_barillot.Dc7ZNHqP_1MG7i2.webp" srcset="/_astro/guillaume_barillot.Dc7ZNHqP_1MG7i2.webp 64w, /_astro/guillaume_barillot.Dc7ZNHqP_16DFrK.webp 128w" alt="Guillaume Barillot" sizes="(min-width: 64px) 64px, 100vw" loading="lazy" decoding="async" fetchpriority="auto" width="64" height="64" style="--w: 64; --h: 64; --fit: cover; --pos: center;" data-astro-image="responsive" class="rounded-full box-content border-2 opacity-70 border-opacity-75"> </div> <div class="text-sm"> <div class="flex justify-center gap-x-1 text-amber-400"> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> </div> <div class="mt-2"> <span class="text-gray-500">"Great support."</span> </div> <div class="pl-3 text-gray-500"> <b>Guillaume Barillot,</b> CTO at Deepidoo </div> </div> </div> </div><div class="hidden lg:block text-center md:w-auto"> <div class="flex flex-row items-center justify-center gap-x-4 flex-1"> <div class="size-16"> <img src="/_astro/mike_roberts.Bee81Ik5_Z1lFWje.webp" srcset="/_astro/mike_roberts.Bee81Ik5_Z1lFWje.webp 64w, /_astro/mike_roberts.Bee81Ik5_Z1g2SRm.webp 128w" alt="Mike Roberts" sizes="(min-width: 64px) 64px, 100vw" loading="lazy" decoding="async" fetchpriority="auto" width="64" height="64" style="--w: 64; --h: 64; --fit: cover; --pos: center;" data-astro-image="responsive" class="rounded-full box-content border-2 opacity-70 border-opacity-75"> </div> <div class="text-sm"> <div class="flex justify-center gap-x-1 text-amber-400"> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> </div> <div class="mt-2"> <span class="text-gray-500">"Great company, great founder!"</span> </div> <div class="pl-3 text-gray-500"> <b>Mike Roberts,</b> Founder at SpyFu </div> </div> </div> </div><div class="hidden lg:block text-center md:w-auto"> <div class="flex flex-row items-center justify-center gap-x-4 flex-1"> <div class="size-16"> <img src="/_astro/lukas_hermann.D7Q61SBS_Z1C7m31.webp" srcset="/_astro/lukas_hermann.D7Q61SBS_Z1C7m31.webp 64w, /_astro/lukas_hermann.D7Q61SBS_XLok0.webp 128w" alt="Lukas Hermann" sizes="(min-width: 64px) 64px, 100vw" loading="lazy" decoding="async" fetchpriority="auto" width="64" height="64" style="--w: 64; --h: 64; --fit: cover; --pos: center;" data-astro-image="responsive" class="rounded-full box-content border-2 opacity-70 border-opacity-75"> </div> <div class="text-sm"> <div class="flex justify-center gap-x-1 text-amber-400"> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> <svg class="h-5 w-5 flex-none" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"> <path fill-rule="evenodd" d="M10.868 2.884c-.321-.772-1.415-.772-1.736 0l-1.83 4.401-4.753.381c-.833.067-1.171 1.107-.536 1.651l3.62 3.102-1.106 4.637c-.194.813.691 1.456 1.405 1.02L10 15.591l4.069 2.485c.713.436 1.598-.207 1.404-1.02l-1.106-4.637 3.62-3.102c.635-.544.297-1.584-.536-1.65l-4.752-.382-1.831-4.401z" clip-rule="evenodd"></path> </svg> </div> <div class="mt-2"> <span class="text-gray-500">"ScreenshotOne is the way to go."</span> </div> <div class="pl-3 text-gray-500"> <b>Lukas Hermann,</b> Co-Founder of Stagetimer </div> </div> </div> </div> </div> <div class="overflow-hidden bg-white pt-24"> <div class="mx-auto max-w-7xl md:px-6 lg:px-8"> <div class="grid grid-cols-1 gap-x-28 gap-y-16 sm:gap-y-20 lg:grid-cols-2 lg:items-center"> <div class="px-6 lg:px-0 lg:pr-4 lg:pt-4 lg:order-last"> <div class="mx-auto max-w-2xl lg:mx-0 lg:max-w-lg"> <h2 class="text-base font-semibold leading-7 text-indigo-600"> Looks great </h2> <p class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">Take clean screenshots</p> <p class="mt-6 text-lg leading-8 text-gray-600">Remove annoying banners easily. ScreenshotOne can block complex GDPR and cookie consent forms. Most cases are covered.</p> <dl class="mt-10 max-w-xl space-y-8 text-base leading-7 text-gray-600 lg:max-w-none"> <div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Remove ads. </dt> <dd class="inline"> You only specify one parameter to blocks, and we do all the hard work of blocking ads for you. </dd> </div><div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Block cookie banners. </dt> <dd class="inline"> Always up-to-date database of 50,000+ rules and heuristics to block cookie banners on any site. </dd> </div><div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> And hide chat widgets. </dt> <dd class="inline"> Our blocking engine not only blocks ads, cookie banners, and other pop-ups but also social media and support chats. </dd> </div> </dl> <div class="mt-10 flex items-center gap-x-6"> <a href="https://dash.screenshotone.com/sign-up" class="rounded-md bg-indigo-600 px-4 py-3 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Get started for free →</a> </div> <div class="mt-2 text-sm text-gray-700"> 100 free screenshots per month. </div> </div> </div> <div class="px-6 lg:px-0"> <div class="api-req-anim flex flex-col items-center"> <div class="browser-mockup shadow-lg"> <img data-change-to="/_astro/cookiebot_without_banner.BBtRQ7sn.jpg" loading="eager" class="" src="/_astro/cookiebot_with_banner.5iWlovjR.jpg" width="2560" height="2048" alt="Take clean screenshots" data-to-class="" data-src="/_astro/cookiebot_with_banner.5iWlovjR.jpg"> </div> <div data-type-text="block_cookie_banners=true" class="api-req-anim-url shadow-lg shadow-indigo-200 p-3 rounded-md hidden lg:block w-full text-base text-center font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(138, 162, 242)"> <span style="color: rgb(230, 230, 230)">https://api.screenshotone.com/take?</span>url=https://cookiebot.com<br>&amp;<span class="url-param"></span> </div> <div data-type-text="block_cookie_banners=true" class="api-req-anim-url shadow-lg shadow-indigo-200 p-3 rounded-md text-sm lg:hidden font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(138, 162, 242)"> <span style="color: rgb(230, 230, 230)">https://api.screenshotone.com/take<br>?</span>url=https://cookiebot.com<br>&amp;<span class="url-param"></span> </div> </div> </div> </div> </div> </div><div class="overflow-hidden bg-white pt-24"> <div class="mx-auto max-w-7xl md:px-6 lg:px-8"> <div class="grid grid-cols-1 gap-x-8 gap-y-16 sm:gap-y-20 lg:grid-cols-2 lg:items-center"> <div class="px-6 lg:px-0 lg:pr-4 lg:pt-4 "> <div class="mx-auto max-w-2xl lg:mx-0 lg:max-w-lg"> <h2 class="text-base font-semibold leading-7 text-indigo-600"> Customize everything </h2> <p class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">Render precisely as you need</p> <p class="mt-6 text-lg leading-8 text-gray-600">Our <b>screenshot API</b> supports a large variety of options for customizing website screenshot rendering. No need to write custom code and logic anymore.</p> <dl class="mt-10 max-w-xl space-y-8 text-base leading-7 text-gray-600 lg:max-w-none"> <div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Render in the dark mode. </dt> <dd class="inline"> Reduce animations, request dark mode theme, or whatever customization you need. </dd> </div><div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Hide selectors and click on elements. </dt> <dd class="inline"> Most common screenshot automations are included as simple options. </dd> </div><div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Add custom JavaScript and CSS. </dt> <dd class="inline"> Our screenshot API covers the most use cases might need. But if something is lacking? You can quickly script it. </dd> </div> </dl> <div class="mt-10 flex items-center gap-x-6"> <a href="https://dash.screenshotone.com/sign-up" class="rounded-md bg-indigo-600 px-4 py-3 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Start rendering →</a> </div> <div class="mt-2 text-sm text-gray-700"> No credit card required. </div> </div> </div> <div class="px-6 lg:px-0"> <div class="api-req-anim flex flex-col items-center"> <div class="browser-mockup shadow-lg"> <img data-change-to="/_astro/tailwindcss_dark_mode.DputSI_d.jpg" loading="lazy" class="" src="/_astro/tailwindcss.zEcYO_Mp.jpg" width="2560" height="2048" alt="Render precisely as you need" data-to-class="" data-src="/_astro/tailwindcss.zEcYO_Mp.jpg"> </div> <div data-type-text="dark_mode=true" class="api-req-anim-url shadow-lg shadow-indigo-200 p-3 rounded-md hidden lg:block w-full text-base text-center font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(219, 236, 249)"> <span style="color: rgb(240, 230, 242)">https://api.screenshotone.com/take?</span>url=https://tailwindcss.com<br>&amp;<span class="url-param"></span> </div> <div data-type-text="dark_mode=true" class="api-req-anim-url shadow-lg shadow-indigo-200 p-3 rounded-md text-sm lg:hidden font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(219, 236, 249)"> <span style="color: rgb(240, 230, 242)">https://api.screenshotone.com/take<br>?</span>url=https://tailwindcss.com<br>&amp;<span class="url-param"></span> </div> </div> </div> </div> </div> </div><div class="overflow-hidden bg-white pt-24"> <div class="mx-auto max-w-7xl md:px-6 lg:px-8"> <div class="grid grid-cols-1 gap-x-28 gap-y-16 sm:gap-y-20 lg:grid-cols-2 lg:items-center"> <div class="px-6 lg:px-0 lg:pr-4 lg:pt-4 lg:order-last"> <div class="mx-auto max-w-2xl lg:mx-0 lg:max-w-lg"> <h2 class="text-base font-semibold leading-7 text-indigo-600"> Pixel-perfect quality </h2> <p class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">Take screenshots for any screen size</p> <p class="mt-6 text-lg leading-8 text-gray-600">Your customers will be pleasantly surprised by the quality of screenshots.</p> <dl class="mt-10 max-w-xl space-y-8 text-base leading-7 text-gray-600 lg:max-w-none"> <div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Render for Apple's Retina Display. </dt> <dd class="inline"> Reduce animations, request dark mode theme, or whatever customization you need. </dd> </div><div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Any custom screen size or predefined by device. </dt> <dd class="inline"> Most common screenshot automations are included as simple options. </dd> </div><div class="relative pl-9"> <dt class="inline font-semibold text-gray-900"> <svg class="absolute left-1 top-1 h-5 w-5 text-indigo-600" 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"><path d="M20 6 9 17l-5-5"></path></svg> Take full-page screenshots with rendered lazy loaded images. </dt> <dd class="inline"> We will scroll and trigger lazy loaded images, scripts and other resources for you to make sure that you get a perfect screenshot containing all the content. </dd> </div> </dl> <div class="mt-10 flex items-center gap-x-6"> <a href="https://dash.screenshotone.com/sign-up" class="rounded-md bg-indigo-600 px-4 py-3 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Integrate now →</a> </div> <div class="mt-2 text-sm text-gray-700"> 100 free screenshots per month. </div> </div> </div> <div class="px-6 lg:px-0"> <div class="api-req-anim flex flex-col items-center"> <div class="browser-mockup shadow-lg"> <img data-change-to="/_astro/ktool_iphone_x.8TsvNRrY.jpg" loading="eager" class="w-full object-contain !max-h-[280px] sm:!max-h-[440px]" src="/_astro/ktool.BXbTnGj7.jpg" width="2560" height="2048" alt="Take screenshots for any screen size" data-to-class="max-w-[275px]" data-src="/_astro/ktool.BXbTnGj7.jpg"> </div> <div data-type-text="viewport_device=iphone_x" class="api-req-anim-url shadow-lg shadow-indigo-200 p-3 rounded-md hidden lg:block w-full text-base text-center font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(249, 250, 252)"> <span style="color: rgb(214, 75, 113)">https://api.screenshotone.com/take?</span>url=https://ktool.io<br>&amp;<span class="url-param"></span> </div> <div data-type-text="viewport_device=iphone_x" class="api-req-anim-url shadow-lg shadow-indigo-200 p-3 rounded-md text-sm lg:hidden font-code tracking-tighter" style="white-space: nowrap; background-color: rgb(33, 34, 69); color: rgb(249, 250, 252)"> <span style="color: rgb(214, 75, 113)">https://api.screenshotone.com/take<br>?</span>url=https://ktool.io<br>&amp;<span class="url-param"></span> </div> </div> </div> </div> </div> </div> <div class="bg-white pt-24"> <div class="mx-auto max-w-7xl px-6 lg:px-8"> <div class="mx-auto max-w-2xl lg:text-center"> <h2 class="text-base font-semibold leading-7 text-indigo-600"> Integrate today </h2> <p class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl"> Use the language you love </p> <p class="mt-6 text-lg leading-8 text-gray-600"> Send simple HTTP requests or use native libraries for your language of choice. You decide. </p> </div> <div class="mx-auto max-w-2xl lg:max-w-none"> <div class="py-8 flex flex-wrap gap-4 sm:flex-nowrap items-center justify-center"> <button type="button" data-target-selector="code-example-java" class="code-example-button min-w-32 justify-center inline-flex items-center gap-x-2 rounded-md bg-indigo-600 text-white px-3.5 py-2.5 text-sm font-semibold shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"> <i class="devicon-java-plain -ml-0.5 text-lg"></i> Java </button><button type="button" data-target-selector="code-example-go" class="code-example-button min-w-32 justify-center inline-flex items-center gap-x-2 rounded-md ring-1 ring-indigo-300 bg-white text-indigo-600 hover:text-white px-3.5 py-2.5 text-sm font-semibold shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"> <i class="devicon-go-plain -ml-0.5 text-lg"></i> Go </button><button type="button" data-target-selector="code-example-javascript" class="code-example-button min-w-32 justify-center inline-flex items-center gap-x-2 rounded-md ring-1 ring-indigo-300 bg-white text-indigo-600 hover:text-white px-3.5 py-2.5 text-sm font-semibold shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"> <i class="devicon-nodejs-plain -ml-0.5 text-lg"></i> Node.js </button><button type="button" data-target-selector="code-example-php" class="code-example-button min-w-32 justify-center inline-flex items-center gap-x-2 rounded-md ring-1 ring-indigo-300 bg-white text-indigo-600 hover:text-white px-3.5 py-2.5 text-sm font-semibold shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"> <i class="devicon-php-plain -ml-0.5 text-lg"></i> PHP </button><button type="button" data-target-selector="code-example-python" class="code-example-button min-w-32 justify-center inline-flex items-center gap-x-2 rounded-md ring-1 ring-indigo-300 bg-white text-indigo-600 hover:text-white px-3.5 py-2.5 text-sm font-semibold shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"> <i class="devicon-python-plain -ml-0.5 text-lg"></i> Python </button><button type="button" data-target-selector="code-example-ruby" class="code-example-button min-w-32 justify-center inline-flex items-center gap-x-2 rounded-md ring-1 ring-indigo-300 bg-white text-indigo-600 hover:text-white px-3.5 py-2.5 text-sm font-semibold shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"> <i class="devicon-ruby-plain -ml-0.5 text-lg"></i> Ruby </button><button type="button" data-target-selector="code-example-csharp" class="code-example-button min-w-32 justify-center inline-flex items-center gap-x-2 rounded-md ring-1 ring-indigo-300 bg-white text-indigo-600 hover:text-white px-3.5 py-2.5 text-sm font-semibold shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"> <i class="devicon-dot-net-plain -ml-0.5 text-lg"></i> C# (.NET) </button> </div> <div class="expressive-code  code-example-code code-example-java mx-auto max-w-3xl"><link rel="stylesheet" href="/_astro/ec.fcmdb.css"><script type="module" src="/_astro/ec.8zarh.js"></script><figure class="frame"><figcaption class="header"></figcaption><pre data-language="java"><code><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// add com.screenshotone.jsdk:screenshotone-api-jsdk:[1.0.0,2.0.0)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// to your `pom.xml` or `build.gradle`</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> com.screenshotone.jsdk.Client;</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> com.screenshotone.jsdk.TakeOptions;</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> java.io.File;</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> java.nio.file.Files;</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">public</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">class</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">App</span><span style="--0:#E1E4E8"> {</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#F97583">public</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">static</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">void</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">main</span><span style="--0:#E1E4E8">(</span><span style="--0:#F97583">String</span><span style="--0:#E1E4E8">[] </span><span style="--0:#FFAB70">args</span><span style="--0:#E1E4E8">) </span><span style="--0:#F97583">throws</span><span style="--0:#E1E4E8"> Exception {</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#F97583">final</span><span style="--0:#E1E4E8"> Client client </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> Client.</span><span style="--0:#B392F0">withKeys</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"&lt;access key&gt;"</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">"&lt;secret key&gt;"</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">        </span></span><span style="--0:#E1E4E8">TakeOptions takeOptions </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> TakeOptions.</span><span style="--0:#B392F0">url</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"https://example.com"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">                </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">fullPage</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">                </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">deviceScaleFactor</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">1</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">                </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">viewportHeight</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">1200</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">                </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">viewportWidth</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">1200</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">                </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">format</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"png"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">                </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">omitBackground</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#F97583">final</span><span style="--0:#E1E4E8"> String url </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">generateTakeUrl</span><span style="--0:#E1E4E8">(takeOptions);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">        </span></span><span style="--0:#E1E4E8">System.out.</span><span style="--0:#B392F0">println</span><span style="--0:#E1E4E8">(url);</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#99A0A6">// Output: https://api.screenshotone.com/take?url=...</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#99A0A6">// or download the screenshot</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#F97583">final</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">byte</span><span style="--0:#E1E4E8">[] image </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">take</span><span style="--0:#E1E4E8">(takeOptions);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">        </span></span><span style="--0:#E1E4E8">Files.</span><span style="--0:#B392F0">write</span><span style="--0:#E1E4E8">(</span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">File</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"./example.png"</span><span style="--0:#E1E4E8">).</span><span style="--0:#B392F0">toPath</span><span style="--0:#E1E4E8">(), image);</span></div></div><div class="ec-line"><div class="code"><span class="indent">        </span><span style="--0:#99A0A6">// the screenshot is stored in the example.png file</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">}</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">}</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="// add com.screenshotone.jsdk:screenshotone-api-jsdk:[1.0.0,2.0.0)// to your `pom.xml` or `build.gradle`import com.screenshotone.jsdk.Client;import com.screenshotone.jsdk.TakeOptions;import java.io.File;import java.nio.file.Files;public class App {    public static void main(String[] args) throws Exception {        final Client client = Client.withKeys(&quot;<access key>&quot;, &quot;<secret key>&quot;);        TakeOptions takeOptions = TakeOptions.url(&quot;https://example.com&quot;)                .fullPage(true)                .deviceScaleFactor(1)                .viewportHeight(1200)                .viewportWidth(1200)                .format(&quot;png&quot;)                .omitBackground(true);        final String url = client.generateTakeUrl(takeOptions);        System.out.println(url);        // Output: https://api.screenshotone.com/take?url=...        // or download the screenshot        final byte[] image = client.take(takeOptions);        Files.write(new File(&quot;./example.png&quot;).toPath(), image);        // the screenshot is stored in the example.png file    }}"><div></div></button></div></figure></div><div class="expressive-code hidden code-example-code code-example-go mx-auto max-w-3xl"><figure class="frame"><figcaption class="header"></figcaption><pre data-language="go"><code><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// go get github.com/screenshotone/gosdk</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> screenshots </span><span style="--0:#9ECBFF">"</span><span style="--0:#B392F0">github.com/screenshotone/gosdk</span><span style="--0:#9ECBFF">"</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">client, err </span><span style="--0:#F97583">:=</span><span style="--0:#E1E4E8"> screenshots.</span><span style="--0:#B392F0">NewClient</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"&lt;access key&gt;"</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">"&lt;secret key&gt;"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// check err</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">options </span><span style="--0:#F97583">:=</span><span style="--0:#E1E4E8"> screenshots.</span><span style="--0:#B392F0">NewTakeOptions</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"https://example.com"</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#B392F0">Format</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"png"</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#B392F0">FullPage</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#B392F0">DeviceScaleFactor</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">2</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#B392F0">BlockAds</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#B392F0">BlockTrackers</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">u, err </span><span style="--0:#F97583">:=</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">GenerateTakeURL</span><span style="--0:#E1E4E8">(options)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// check err</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">fmt.</span><span style="--0:#B392F0">Println</span><span style="--0:#E1E4E8">(u.</span><span style="--0:#B392F0">String</span><span style="--0:#E1E4E8">())</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// Output: https://api.screenshotone.com/take?url=...</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// or download the screenshot</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">image, err </span><span style="--0:#F97583">:=</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">Take</span><span style="--0:#E1E4E8">(context.</span><span style="--0:#B392F0">TODO</span><span style="--0:#E1E4E8">(), options)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// check err</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">defer</span><span style="--0:#E1E4E8"> image.</span><span style="--0:#B392F0">Close</span><span style="--0:#E1E4E8">()</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">out, err </span><span style="--0:#F97583">:=</span><span style="--0:#E1E4E8"> os.</span><span style="--0:#B392F0">Create</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"example.png"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// check err</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">defer</span><span style="--0:#E1E4E8"> out.</span><span style="--0:#B392F0">Close</span><span style="--0:#E1E4E8">()</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">io.</span><span style="--0:#B392F0">Copy</span><span style="--0:#E1E4E8">(out, image)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// the screenshot is stored in the example.png file</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="// go get github.com/screenshotone/gosdkimport screenshots &quot;github.com/screenshotone/gosdk&quot;client, err := screenshots.NewClient(&quot;<access key>&quot;, &quot;<secret key>&quot;)// check erroptions := screenshots.NewTakeOptions(&quot;https://example.com&quot;).    Format(&quot;png&quot;).    FullPage(true).    DeviceScaleFactor(2).    BlockAds(true).    BlockTrackers(true)u, err := client.GenerateTakeURL(options)// check errfmt.Println(u.String())// Output: https://api.screenshotone.com/take?url=...// or download the screenshotimage, err := client.Take(context.TODO(), options)// check errdefer image.Close()out, err := os.Create(&quot;example.png&quot;)// check errdefer out.Close()io.Copy(out, image)// the screenshot is stored in the example.png file"><div></div></button></div></figure></div><div class="expressive-code hidden code-example-code code-example-javascript mx-auto max-w-3xl"><figure class="frame"><figcaption class="header"></figcaption><pre data-language="javascript"><code><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// $ npm install screenshotone-api-sdk --save</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">*</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">as</span><span style="--0:#E1E4E8"> fs </span><span style="--0:#F97583">from</span><span style="--0:#E1E4E8"> </span><span style="--0:#9ECBFF">'fs'</span><span style="--0:#E1E4E8">;</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">*</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">as</span><span style="--0:#E1E4E8"> screenshotone </span><span style="--0:#F97583">from</span><span style="--0:#E1E4E8"> </span><span style="--0:#9ECBFF">'screenshotone-api-sdk'</span><span style="--0:#E1E4E8">;</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// create API client</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">const</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">client</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8"> screenshotone.</span><span style="--0:#B392F0">Client</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"&lt;access key&gt;"</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">"&lt;secret key&gt;"</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// set up options</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">const</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">options</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> screenshotone.TakeOptions</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">url</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"https://example.com"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">delay</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">3</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">blockAds</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// generate URL</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">const</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">url</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">generateTakeURL</span><span style="--0:#E1E4E8">(options);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">console.</span><span style="--0:#B392F0">log</span><span style="--0:#E1E4E8">(url);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// expected output: https://api.screenshotone.com/take?url=...</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// or download the screenshot</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">const</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">imageBlob</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">await</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">take</span><span style="--0:#E1E4E8">(options);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">const</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">buffer</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> Buffer.</span><span style="--0:#B392F0">from</span><span style="--0:#E1E4E8">(</span><span style="--0:#F97583">await</span><span style="--0:#E1E4E8"> imageBlob.</span><span style="--0:#B392F0">arrayBuffer</span><span style="--0:#E1E4E8">());</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">fs.</span><span style="--0:#B392F0">writeFileSync</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"example.png"</span><span style="--0:#E1E4E8">, buffer)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// the screenshot is stored in the example.png file</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="// $ npm install screenshotone-api-sdk --saveimport * as fs from 'fs';import * as screenshotone from 'screenshotone-api-sdk';// create API clientconst client = new screenshotone.Client(&quot;<access key>&quot;, &quot;<secret key>&quot;);// set up optionsconst options = screenshotone.TakeOptions    .url(&quot;https://example.com&quot;)    .delay(3)    .blockAds(true);// generate URLconst url = client.generateTakeURL(options);console.log(url);// expected output: https://api.screenshotone.com/take?url=...// or download the screenshotconst imageBlob = await client.take(options);const buffer = Buffer.from(await imageBlob.arrayBuffer());fs.writeFileSync(&quot;example.png&quot;, buffer)// the screenshot is stored in the example.png file"><div></div></button></div></figure></div><div class="expressive-code hidden code-example-code code-example-php mx-auto max-w-3xl"><figure class="frame"><figcaption class="header"></figcaption><pre data-language="php"><code><div class="ec-line"><div class="code"><span style="--0:#F97583">&lt;?</span><span style="--0:#79B8FF">php</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// composer require screenshotone/sdk:^1.0</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">use</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">ScreenshotOneSdkClient</span><span style="--0:#E1E4E8">;</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">use</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">ScreenshotOneSdkTakeOptions</span><span style="--0:#E1E4E8">;</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">$client </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">Client</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"&lt;access key&gt;"</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">"&lt;secret key&gt;"</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">$options </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">TakeOptions</span><span style="--0:#F97583">::</span><span style="--0:#B392F0">url</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"https://example.com"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#F97583">-&gt;</span><span style="--0:#B392F0">fullPage</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#F97583">-&gt;</span><span style="--0:#B392F0">delay</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">2</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#F97583">-&gt;</span><span style="--0:#B392F0">geolocationLatitude</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">48.857648</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#F97583">-&gt;</span><span style="--0:#B392F0">geolocationLongitude</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">2.294677</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent">    </span><span style="--0:#F97583">-&gt;</span><span style="--0:#B392F0">geolocationAccuracy</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">50</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">$url </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> $client</span><span style="--0:#F97583">-&gt;</span><span style="--0:#B392F0">generateTakeUrl</span><span style="--0:#E1E4E8">($options);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#79B8FF">echo</span><span style="--0:#E1E4E8"> $url</span><span style="--0:#F97583">.</span><span style="--0:#79B8FF">PHP_EOL</span><span style="--0:#E1E4E8">;</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// expected output: https://api.screenshotone.com/take?url=https%3A%2F%2Fexample.com...</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">$image </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> $client</span><span style="--0:#F97583">-&gt;</span><span style="--0:#B392F0">take</span><span style="--0:#E1E4E8">($options);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#79B8FF">file_put_contents</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">'example.png'</span><span style="--0:#E1E4E8">, $image);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// the screenshot is stored in the example.png file</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="<?php// composer require screenshotone/sdk:^1.0use ScreenshotOneSdkClient;use ScreenshotOneSdkTakeOptions;$client = new Client(&quot;<access key>&quot;, &quot;<secret key>&quot;);$options = TakeOptions::url(&quot;https://example.com&quot;)    ->fullPage(true)    ->delay(2)    ->geolocationLatitude(48.857648)    ->geolocationLongitude(2.294677)    ->geolocationAccuracy(50);$url = $client->generateTakeUrl($options);echo $url.PHP_EOL;// expected output: https://api.screenshotone.com/take?url=https%3A%2F%2Fexample.com...$image = $client->take($options);file_put_contents('example.png', $image);// the screenshot is stored in the example.png file"><div></div></button></div></figure></div><div class="expressive-code hidden code-example-code code-example-python mx-auto max-w-3xl"><figure class="frame"><figcaption class="header"></figcaption><pre data-language="python"><code><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># pip install screenshotone</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> shutil</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">from</span><span style="--0:#E1E4E8"> screenshotone </span><span style="--0:#F97583">import</span><span style="--0:#E1E4E8"> Client, TakeOptions</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># create API client</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">client </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> Client(</span><span style="--0:#9ECBFF">'&lt;access key&gt;'</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">'&lt;secret key&gt;'</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># set up options</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">options </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> (TakeOptions.url(</span><span style="--0:#9ECBFF">'https://screenshotone.com'</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.format(</span><span style="--0:#9ECBFF">"png"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.viewport_width(</span><span style="--0:#79B8FF">1024</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.viewport_height(</span><span style="--0:#79B8FF">768</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.block_cookie_banners(</span><span style="--0:#79B8FF">True</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">.block_chats(</span><span style="--0:#79B8FF">True</span><span style="--0:#E1E4E8">))</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># generate the screenshot URL and share it with a user</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">url </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> client.generate_take_url(options)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># expected output: https://api.screenshotone.com/take?url=https%3A%2F%2Fscreenshotone.com&amp;viewport_width=1024&amp;viewport_height=768&amp;block_cookie_banners=True&amp;block_chats=True&amp;access_key=&amp;signature=6afc9417a523788580fa01a9f668ea82c78a9d2b41441d2a696010bf2743170f</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># or render a screenshot and download the image as stream</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">image </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> client.take(options)</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># store the screenshot the example.png file</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">with</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">open</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">'example.png'</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">'wb'</span><span style="--0:#E1E4E8">) </span><span style="--0:#F97583">as</span><span style="--0:#E1E4E8"> result_file:</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">    </span></span><span style="--0:#E1E4E8">shutil.copyfileobj(image, result_file)</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="# pip install screenshotoneimport shutilfrom screenshotone import Client, TakeOptions# create API clientclient = Client('<access key>', '<secret key>')# set up optionsoptions = (TakeOptions.url('https://screenshotone.com')    .format(&quot;png&quot;)    .viewport_width(1024)    .viewport_height(768)    .block_cookie_banners(True)    .block_chats(True))# generate the screenshot URL and share it with a userurl = client.generate_take_url(options)# expected output: https://api.screenshotone.com/take?url=https%3A%2F%2Fscreenshotone.com&amp;viewport_width=1024&amp;viewport_height=768&amp;block_cookie_banners=True&amp;block_chats=True&amp;access_key=&amp;signature=6afc9417a523788580fa01a9f668ea82c78a9d2b41441d2a696010bf2743170f# or render a screenshot and download the image as streamimage = client.take(options)# store the screenshot the example.png filewith open('example.png', 'wb') as result_file:    shutil.copyfileobj(image, result_file)"><div></div></button></div></figure></div><div class="expressive-code hidden code-example-code code-example-ruby mx-auto max-w-3xl"><figure class="frame"><figcaption class="header"></figcaption><pre data-language="ruby"><code><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># Add this gem to your Gemfile:</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># gem 'screenshotone'</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># If you don't need to add a signature</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">client </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">ScreenshotOne</span><span style="--0:#E1E4E8">::</span><span style="--0:#79B8FF">Client</span><span style="--0:#E1E4E8">.</span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">'&lt;access key&gt;'</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># Or ff you do need to add a signature</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">client </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">ScreenshotOne</span><span style="--0:#E1E4E8">::</span><span style="--0:#79B8FF">Client</span><span style="--0:#E1E4E8">.</span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">'&lt;access key&gt;'</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">'&lt;secret key&gt;'</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># You can set any available option, in a camel_case format, for example:</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">options </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#79B8FF">ScreenshotOne</span><span style="--0:#E1E4E8">::</span><span style="--0:#79B8FF">TakeOptions</span><span style="--0:#E1E4E8">.</span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">url:</span><span style="--0:#E1E4E8"> </span><span style="--0:#9ECBFF">'https://example.com'</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">            </span></span><span style="--0:#E1E4E8">full_page(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">            </span></span><span style="--0:#E1E4E8">delay(</span><span style="--0:#79B8FF">2</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">            </span></span><span style="--0:#E1E4E8">geolocation_latitude(</span><span style="--0:#79B8FF">48.857648</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">            </span></span><span style="--0:#E1E4E8">geolocation_longitude(</span><span style="--0:#79B8FF">2.294677</span><span style="--0:#E1E4E8">).</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">            </span></span><span style="--0:#E1E4E8">geolocation_accuracy(</span><span style="--0:#79B8FF">50</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># Verify all the parameters are valid (we will validate the parameters that should be</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># numeric, booleans or that accept only certain values)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">options.valid?</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">=&gt; </span><span style="--0:#79B8FF">true</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># To simply get the final url:</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">client.generate_take_url(options)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">=&gt; </span><span style="--0:#9ECBFF">"https://api.screenshotone.com/take?url=https%3A%2F%2Fexample.com..."</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6"># To actually get the image (the response body of a request to the previous url)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">client.take(options)</span></div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">=&gt; </span><span style="--0:#9ECBFF">"ÿØÿàJFIFÿ..."</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="# Add this gem to your Gemfile:# gem 'screenshotone'# If you don't need to add a signatureclient = ScreenshotOne::Client.new('<access key>')# Or ff you do need to add a signatureclient = ScreenshotOne::Client.new('<access key>', '<secret key>')# You can set any available option, in a camel_case format, for example:options = ScreenshotOne::TakeOptions.new(url: 'https://example.com').            full_page(true).            delay(2).            geolocation_latitude(48.857648).            geolocation_longitude(2.294677).            geolocation_accuracy(50)# Verify all the parameters are valid (we will validate the parameters that should be# numeric, booleans or that accept only certain values)options.valid?=> true# To simply get the final url:client.generate_take_url(options)=> &quot;https://api.screenshotone.com/take?url=https%3A%2F%2Fexample.com...&quot;# To actually get the image (the response body of a request to the previous url)client.take(options)=> &quot;ÿØÿà�JFIF������ÿ...&quot;"><div></div></button></div></figure></div><div class="expressive-code hidden code-example-code code-example-csharp mx-auto max-w-3xl"><figure class="frame"><figcaption class="header"></figcaption><pre data-language="csharp"><code><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// Add the library via nuget using the package manager console: PM&gt; Install-Package ScreenshotOne.dotnetsdk</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// Or from the .NET CLI as: dotnet add package ScreenshotOne.dotnetsdk</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// And generate a screenshot URL without executing request:</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">var</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">client</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">Client</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"&lt;access key&gt;"</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">"&lt;secret key&gt;"</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">var</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">options</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> TakeOptions.</span><span style="--0:#B392F0">Url</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"https://www.amazon.com"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">  </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">FullPage</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">  </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">Format</span><span style="--0:#E1E4E8">(Format.PNG)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">  </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">BlockCookieBanners</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">var</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">url</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">GenerateTakeUrl</span><span style="--0:#E1E4E8">(options);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// url = https://api.screenshotone.com/take?url=https%3A%2F%2Fwww.amazon.com&amp;full_page=true&amp;format=png&amp;block_cookie_banners=true&amp;access_key=_OzqMIjpCw-ARQ&amp;signature=8a08e62d13a5c3490fda0734b6707791d3decc9ab9ba41e8cc045288a39db502</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#99A0A6">// Or take a screenshot and save the image in the file:</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">var</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">client</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">new</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">Client</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"&lt;access key&gt;"</span><span style="--0:#E1E4E8">, </span><span style="--0:#9ECBFF">"&lt;secret key&gt;"</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">var</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">options</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> TakeOptions.</span><span style="--0:#B392F0">Url</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">"https://www.google.com"</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">  </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">FullPage</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">  </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">Format</span><span style="--0:#E1E4E8">(Format.PNG)</span></div></div><div class="ec-line"><div class="code"><span class="indent"><span style="--0:#E1E4E8">  </span></span><span style="--0:#E1E4E8">.</span><span style="--0:#B392F0">BlockCookieBanners</span><span style="--0:#E1E4E8">(</span><span style="--0:#79B8FF">true</span><span style="--0:#E1E4E8">);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#F97583">var</span><span style="--0:#E1E4E8"> </span><span style="--0:#B392F0">bytes</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">=</span><span style="--0:#E1E4E8"> </span><span style="--0:#F97583">await</span><span style="--0:#E1E4E8"> client.</span><span style="--0:#B392F0">Take</span><span style="--0:#E1E4E8">(options);</span></div></div><div class="ec-line"><div class="code">
</div></div><div class="ec-line"><div class="code"><span style="--0:#E1E4E8">File.</span><span style="--0:#B392F0">WriteAllBytes</span><span style="--0:#E1E4E8">(</span><span style="--0:#9ECBFF">@"c:  empexample.png"</span><span style="--0:#E1E4E8">, bytes);</span></div></div></code></pre><div class="copy"><button title="Copy to clipboard" data-copied="Copied!" data-code="// Add the library via nuget using the package manager console: PM> Install-Package ScreenshotOne.dotnetsdk// Or from the .NET CLI as: dotnet add package ScreenshotOne.dotnetsdk// And generate a screenshot URL without executing request:var client = new Client(&quot;<access key>&quot;, &quot;<secret key>&quot;);var options = TakeOptions.Url(&quot;https://www.amazon.com&quot;)  .FullPage(true)  .Format(Format.PNG)  .BlockCookieBanners(true);var url = client.GenerateTakeUrl(options);// url = https://api.screenshotone.com/take?url=https%3A%2F%2Fwww.amazon.com&amp;full_page=true&amp;format=png&amp;block_cookie_banners=true&amp;access_key=_OzqMIjpCw-ARQ&amp;signature=8a08e62d13a5c3490fda0734b6707791d3decc9ab9ba41e8cc045288a39db502// Or take a screenshot and save the image in the file:var client = new Client(&quot;<access key>&quot;, &quot;<secret key>&quot;);var options = TakeOptions.Url(&quot;https://www.google.com&quot;)  .FullPage(true)  .Format(Format.PNG)  .BlockCookieBanners(true);var bytes = await client.Take(options);File.WriteAllBytes(@&quot;c:  empexample.png&quot;, bytes);"><div></div></button></div></figure></div> </div> </div> </div> <script type="text/javascript">
    document.addEventListener("DOMContentLoaded", () => {
        const buttons = document.querySelectorAll(".code-example-button");
        const codeExamples = document.querySelectorAll(".code-example-code");
        for (const button of buttons) {
            const targetSelector = button.dataset.targetSelector;
            button.addEventListener("click", () => {
                for (const codeExample of codeExamples) {
                    if (codeExample.classList.contains(targetSelector)) {
                        codeExample.classList.remove("hidden");
                    } else {
                        codeExample.classList.add("hidden");
                    }
                }

                const activeClasses = "bg-indigo-600 text-white".split(" ");
                const inactiveClasses =
                    "ring-1 ring-indigo-300 bg-white text-indigo-600 hover:text-white".split(
                        " "
                    );

                if (button.classList.contains("bg-indigo-600")) {
                    return;
                }

                for (const b of buttons) {
                    for (const activeClass of activeClasses) {
                        b.classList.remove(activeClass);
                    }
                    for (const inactiveClass of inactiveClasses) {
                        b.classList.add(inactiveClass);
                    }
                }

                for (const activeClass of activeClasses) {
                    button.classList.add(activeClass);
                }
                for (const inactiveClass of inactiveClasses) {
                    button.classList.remove(inactiveClass);
                }
            });
        }
    });
</script> <div class="bg-white pt-24"> <div class="mx-auto max-w-7xl px-6 lg:px-8"> <div class="mx-auto max-w-2xl lg:text-center"> <h2 class="text-base font-semibold leading-7 text-indigo-600"> Save time on writing code </h2> <p class="mt-2 text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl"> No-code integrations </p> <p class="mt-6 text-lg leading-8 text-gray-600"> Quickly render website screenshots with Zapier, Airtable, Make and other popular no-code platforms of your choice. </p> </div> <div class="mt-10 mx-auto max-w-2xl lg:max-w-none"> <div class="mx-auto grid max-w-lg grid-cols-4 items-center gap-x-8 gap-y-12 sm:max-w-xl sm:grid-cols-6 sm:gap-x-10 sm:gap-y-14 lg:mx-0 lg:max-w-none"> <img class="col-span-2 max-h-14 w-full object-contain lg:col-span-1" src="/images/no-code/zapier-official.svg" alt="Zapier" width="158" height="48"> <img class="col-span-2 max-h-12 w-full object-contain lg:col-span-1" src="/images/no-code/airtable.svg" alt="Airtable" width="158" height="48"> <img class="col-span-2 max-h-14 w-full object-cover lg:col-span-1" src="/images/no-code/make.svg" alt="Make" width="158" height="48"> <img class="col-span-2 max-h-12 w-full object-cover lg:col-span-1" src="/images/no-code/bubble.svg" alt="Bubble" width="158" height="48"> <img class="col-span-2 max-h-12 w-full object-cover lg:col-span-1" src="/images/no-code/n8n.io.svg" alt="n8n.io" width="158" height="48"> <a href="/docs/no-code/summit/"> <img class="col-span-2 max-h-12 w-full object-contain lg:col-span-1" src="/images/no-code/usesummit.png" alt="usesummit.com" width="158" height="48"> </a> </div> </div> </div> </div> <div class="bg-white pt-24"> <div class="bg-gray-900 pb-6 sm:pb-24 xl:pb-0"> <div class="mx-auto flex max-w-7xl flex-col items-center gap-x-8 gap-y-10 px-6 sm:gap-y-8 lg:px-8 xl:flex-row xl:items-stretch"> <div class="mx-auto max-w-3xl xl:flex-auto xl:px-16 xl:py-24"> <figure class="relative isolate pt-6 sm:pt-12"> <svg viewBox="0 0 162 128" fill="none" aria-hidden="true" class="absolute left-0 top-0 -z-10 h-32 stroke-white/20"> <path id="b56e9dab-6ccb-4d32-ad02-6b4bb5d9bbeb" d="M65.5697 118.507L65.8918 118.89C68.9503 116.314 71.367 113.253 73.1386 109.71C74.9162 106.155 75.8027 102.28 75.8027 98.0919C75.8027 94.237 75.16 90.6155 73.8708 87.2314C72.5851 83.8565 70.8137 80.9533 68.553 78.5292C66.4529 76.1079 63.9476 74.2482 61.0407 72.9536C58.2795 71.4949 55.276 70.767 52.0386 70.767C48.9935 70.767 46.4686 71.1668 44.4872 71.9924L44.4799 71.9955L44.4726 71.9988C42.7101 72.7999 41.1035 73.6831 39.6544 74.6492C38.2407 75.5916 36.8279 76.455 35.4159 77.2394L35.4047 77.2457L35.3938 77.2525C34.2318 77.9787 32.6713 78.3634 30.6736 78.3634C29.0405 78.3634 27.5131 77.2868 26.1274 74.8257C24.7483 72.2185 24.0519 69.2166 24.0519 65.8071C24.0519 60.0311 25.3782 54.4081 28.0373 48.9335C30.703 43.4454 34.3114 38.345 38.8667 33.6325C43.5812 28.761 49.0045 24.5159 55.1389 20.8979C60.1667 18.0071 65.4966 15.6179 71.1291 13.7305C73.8626 12.8145 75.8027 10.2968 75.8027 7.38572C75.8027 3.6497 72.6341 0.62247 68.8814 1.1527C61.1635 2.2432 53.7398 4.41426 46.6119 7.66522C37.5369 11.6459 29.5729 17.0612 22.7236 23.9105C16.0322 30.6019 10.618 38.4859 6.47981 47.558L6.47976 47.558L6.47682 47.5647C2.4901 56.6544 0.5 66.6148 0.5 77.4391C0.5 84.2996 1.61702 90.7679 3.85425 96.8404L3.8558 96.8445C6.08991 102.749 9.12394 108.02 12.959 112.654L12.959 112.654L12.9646 112.661C16.8027 117.138 21.2829 120.739 26.4034 123.459L26.4033 123.459L26.4144 123.465C31.5505 126.033 37.0873 127.316 43.0178 127.316C47.5035 127.316 51.6783 126.595 55.5376 125.148L55.5376 125.148L55.5477 125.144C59.5516 123.542 63.0052 121.456 65.9019 118.881L65.5697 118.507Z"></path> <use href="#b56e9dab-6ccb-4d32-ad02-6b4bb5d9bbeb" x="86"></use> </svg> <blockquote class="text-xl font-semibold leading-8 text-white sm:text-2xl sm:leading-9 space-y-2"> <p>
ScreenshotOne is the best product on the market -
                            and that's before you take into account how
                            responsive and easy Dmytro is to work with.
</p><p>
Any time we've found a rare edge case, it's been
                            resolved in hours.
</p><p>
Great company, great founder - can't say enough!
</p> </blockquote> <figcaption class="mt-8 text-base flex flex-row items-center gap-x-6"> <div> <img src="/_astro/mike_roberts.Bee81Ik5_Z1lFWje.webp" srcset="/_astro/mike_roberts.Bee81Ik5_Z1lFWje.webp 64w, /_astro/mike_roberts.Bee81Ik5_Z1g2SRm.webp 128w" alt="Mike Roberts" loading="lazy" sizes="(min-width: 64px) 64px, 100vw" decoding="async" fetchpriority="auto" width="64" height="64" style="--w: 64; --h: 64; --fit: cover; --pos: center;" data-astro-image="responsive" class="rounded-full bg-gray-800 shadow-2xl"> </div> <div> <div class="font-semibold text-white">
Mike Roberts
</div> <div class="mt-1 text-gray-400">
Founder of SpyFu
</div> </div> </figcaption> </figure> </div> </div> </div> </div> <div class="px-6 py-24 sm:px-6 lg:px-8"> <div class="mx-auto max-w-2xl text-center"> <h2 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">
Automate website screenshots.<br>Start rendering today.
</h2> <p class="mx-auto mt-6 max-w-xl text-lg leading-8 text-gray-600">
Superb and exhaustive documentation, ready SDKs, no-code tools, and
            other automation to help you render website screenshots and
            outsource all the boring work related to that to us.
</p> <div class="mt-10 flex items-center justify-center gap-x-6"> <a href="https://dash.screenshotone.com/sign-up" class="rounded-md bg-indigo-600 px-4 py-3 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Start rendering →</a> <a href="/book-a-call" class="rounded-md ring-1 ring-inset ring-indigo-600 px-4 py-3 text-sm font-semibold text-indigo-600 shadow-sm hover:bg-indigo-600 hover:text-white focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">Book a demo</a> </div> </div> </div> <script type="module">let L={};function M(i){return Math.floor(Math.random()*i)}function O(i){const e=i.parentNode,r=e.querySelector("img"),l=e.querySelector(".api-req-anim-url").getAttribute("data-type-text");if(!(l in L)){L[l]=!0;for(const c of e.querySelectorAll(".api-req-anim-url"))W(c,r)}}function N(i){var e=window.getComputedStyle(i);return e.display==="none"}function D(){const i=navigator.userAgent,e=i.indexOf("Chrome")>-1||i.indexOf("Chromium")>-1;return i.indexOf("Safari")>-1&&!e}function W(i,e){if(N(i))return;const r=i.getAttribute("data-type-text"),l=i.querySelector(".url-param");let c=null,q=50,h=!1,d=0,w=0;const p=e.getAttribute("data-src"),t=e.getAttribute("data-to-class");e.onload=()=>{D()&&t&&(e.classList.contains(t)?e.classList.remove(t):e.classList.add(t))};const o=n=>{window.requestAnimationFrame(o),c==null&&(c=n);const s=n-c,a=M(Math.abs(50-r.length)*10);s>q+a&&(h?(w>=30&&(e.src=p,l.innerHTML="",d=0,h=!1,w=0),w++):(d<=r.length?l.innerHTML=r.substring(0,d)+"|":(l.innerHTML=r.substring(0,d),e.src=e.getAttribute("data-change-to"),h=!0),d++),c=n)};window.requestAnimationFrame(o)}(function(){if(window.requestAnimationFrame&&document.documentElement.classList){var i=function(t,o,n){var s={now:Date.now||function(){return new Date().getTime()}},a,u,v,f=null,m=0;n||(n={});var A=function(){m=n.leading===!1?0:s.now(),f=null,v=t.apply(a,u),f||(a=u=null)};return function(){var g=s.now();!m&&n.leading===!1&&(m=g);var y=o-(g-m);return a=this,u=arguments,y<=0||y>o?(f&&(clearTimeout(f),f=null),m=g,v=t.apply(a,u),f||(a=u=null)):!f&&n.trailing!==!1&&(f=setTimeout(A,y)),v}},e=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame,r=document.querySelectorAll(".api-req-anim-url"),l=function(){return{width:window.document.documentElement.clientWidth,height:window.document.documentElement.clientHeight}},c=function(){return{x:window.pageXOffset,y:window.pageYOffset}},q=function(t){var o=0,n=0,s=t.offsetHeight,a=t.offsetWidth;do isNaN(t.offsetTop)||(o+=t.offsetTop),isNaN(t.offsetLeft)||(n+=t.offsetLeft);while((t=t.offsetParent)!==null);return{top:o,left:n,height:s,width:a}},h=function(t){var o=l(),n=c(),s=q(t),a=.2,u=s.height,v=s.width,f=s.top,m=s.left,A=f+u,g=m+v,y=function(){var S=f+u*a,T=m+v*a,x=A-u*a,b=g-v*a,E=n.y+0,F=n.x+0,R=n.y-0+o.height,C=n.x-0+o.width;return S<R&&x>E&&T>F&&b<C};return y()},d=function(){for(var t=0;t<r.length;t++)h(r[t])&&O(r[t])},w=i(function(){e(d)},300),p=i(function(){e(d)},300);w(),window.addEventListener?(addEventListener("scroll",w,!1),addEventListener("resize",p,!1)):window.attachEvent?(window.attachEvent("onscroll",w),window.attachEvent("onresize",p)):(window.onscroll=w,window.onresize=p)}})();</script>  <footer class="bg-gray-900" aria-labelledby="footer-heading"> <h2 id="footer-heading" class="sr-only">Footer</h2> <div class="mx-auto max-w-7xl px-6 pb-8 pt-16 sm:pt-24 lg:px-8 lg:pt-32"> <div class="xl:grid xl:grid-cols-3 xl:gap-8"> <div class="space-y-8"> <img class="h-7" src="/logo.svg" alt="ScreenshotOne"> <p class="text-sm leading-6 text-gray-300">
ScreenshotOne is a screenshot rendering platform for your
                    business.
</p> <div class="flex space-x-6"> <a href="https://x.com/ScreenshotOneHQ" class="text-gray-500 hover:text-gray-400"> <span class="sr-only">X</span> <span><svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
                <path d="M13.6823 10.6218L20.2391 3H18.6854L12.9921 9.61788L8.44486 3H3.2002L10.0765 13.0074L3.2002 21H4.75404L10.7663 14.0113L15.5685 21H20.8131L13.6819 10.6218H13.6823ZM11.5541 13.0956L10.8574 12.0991L5.31391 4.16971H7.70053L12.1742 10.5689L12.8709 11.5655L18.6861 19.8835H16.2995L11.5541 13.096V13.0956Z"></path>
            </svg></span> </a><a href="https://www.producthunt.com/products/screenshotone" class="text-gray-500 hover:text-gray-400"> <span class="sr-only">Product Hunt</span> <span><svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="32" height="32" fill="currentColor"><path d="M12.001 22C6.47813 22 2.00098 17.5228 2.00098 12C2.00098 6.47715 6.47813 2 12.001 2C17.5238 2 22.001 6.47715 22.001 12C22.001 17.5228 17.5238 22 12.001 22ZM13.3345 12H10.501V9H13.3345C14.1629 9 14.8345 9.67157 14.8345 10.5C14.8345 11.3284 14.1629 12 13.3345 12ZM13.3345 7H8.50098V17H10.501V14H13.3345C15.2675 14 16.8345 12.433 16.8345 10.5C16.8345 8.567 15.2675 7 13.3345 7Z"></path></svg></span> </a><a href="https://github.com/screenshotone" class="text-gray-500 hover:text-gray-400"> <span class="sr-only">GitHub</span> <span><svg class="h-6 w-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
                <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path>
            </svg></span> </a><a href="https://www.linkedin.com/company/screenshotone" class="text-gray-500 hover:text-gray-400"> <span class="sr-only">LinkedIn</span> <span><svg class="h-6 w-6" 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"><path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path><rect width="4" height="12" x="2" y="9"></rect><circle cx="4" cy="4" r="2"></circle></svg></span> </a> </div> <iframe src="https://status.screenshotone.com/badge?theme=dark" width="250" height="30" loading="lazy" title="The ScreenshotOne Status Page" frameborder="0" scrolling="no"></iframe> </div> <div class="mt-16 grid grid-cols-2 gap-8 xl:col-span-2 xl:mt-0"> <div class="md:grid md:grid-cols-2 md:gap-8"> <div> <h3 class="text-sm font-semibold leading-6 text-white">
Integrations
</h3> <ul role="list" class="mt-6 space-y-4"> <li> <a href="https://screenshotone.com/blog/unveil-the-power-of-automation-with-screenshotone-and-zapier/" class="text-sm leading-6 text-gray-300 hover:text-white"> Zapier </a> </li><li> <a href="https://screenshotone.com/docs/code-examples/" class="text-sm leading-6 text-gray-300 hover:text-white"> SDK and Code Examples </a> </li><li> <a href="/docs/upload-to-s3/" class="text-sm leading-6 text-gray-300 hover:text-white"> Upload to Amazon S3 </a> </li><li> <a href="https://rapidapi.com/screenshotone-api-screenshotone-api-default/api/screenshotone1" class="text-sm leading-6 text-gray-300 hover:text-white"> RapidAPI Hub </a> </li><li> <a href="https://www.sanity.io/plugins/sanity-plugin-asset-source-screenshotone" class="text-sm leading-6 text-gray-300 hover:text-white"> Plugin for Sanity </a> </li><li> <a href="https://screenshotone.com/docs/signed-requests/" class="text-sm leading-6 text-gray-300 hover:text-white"> Signed Links </a> </li><li> <a href="https://flowmattic.com/integration/screenshotone/" class="text-sm leading-6 text-gray-300 hover:text-white"> FlowMattic </a> </li><li> <a href="https://screenshotone.com/blog/a-friendly-guide-on-how-to-render-html-or-site-screenshots-in-google-sheets-in-less-than-10-minutes/" class="text-sm leading-6 text-gray-300 hover:text-white"> Google Sheets </a> </li> </ul> </div> <div class="mt-10 md:mt-0"> <h3 class="text-sm font-semibold leading-6 text-white">
Resources
</h3> <ul role="list" class="mt-6 space-y-4"> <li> <a href="/docs/getting-started/" class="text-sm leading-6 text-gray-300 hover:text-white"> Documentation </a> </li><li> <a href="/blog/" class="text-sm leading-6 text-gray-300 hover:text-white"> Blog </a> </li><li> <a href="/use-cases/" class="text-sm leading-6 text-gray-300 hover:text-white"> Use Cases </a> </li><li> <a href="/blog/what-is-a-screenshot-or-html-rendering-api/" class="text-sm leading-6 text-gray-300 hover:text-white"> What is a screenshot API? </a> </li> </ul> <a href="/tools/"> <h3 class="mt-6 text-sm font-semibold leading-6 text-white">
Screenshot Tools
</h3> </a> <ul role="list" class="mt-6 space-y-4"> <li> <a href="/tools/website-screenshot/" class="text-sm leading-6 text-gray-300 hover:text-white"> Website Screenshots </a> </li><li> <a href="/tools/full-page-website-screenshot/" class="text-sm leading-6 text-gray-300 hover:text-white"> Full Page Screenshots </a> </li><li> <a href="/tools/scrolling-website-screenshot/" class="text-sm leading-6 text-gray-300 hover:text-white"> Scrolling Screenshots </a> </li> </ul> </div> </div> <div class="md:grid md:grid-cols-2 md:gap-8"> <div> <h3 class="text-sm font-semibold leading-6 text-white">
Product
</h3> <ul role="list" class="mt-6 space-y-4"> <li> <a href="/scrolling-screenshots/" class="text-sm leading-6 text-gray-300 hover:text-white"> Scrolling Screenshots </a> </li><li> <a href="/" class="text-sm leading-6 text-gray-300 hover:text-white"> Screenshot API </a> </li><li> <a href="/about/" class="text-sm leading-6 text-gray-300 hover:text-white"> About </a> </li><li> <a href="/roadmap/" class="text-sm leading-6 text-gray-300 hover:text-white"> Roadmap </a> </li><li> <a href="https://status.screenshotone.com" class="text-sm leading-6 text-gray-300 hover:text-white"> Status </a> </li><li> <a href="/affiliate-program/" class="text-sm leading-6 text-gray-300 hover:text-white"> Affiliate Program </a> </li> </ul> </div> <div class="mt-10 md:mt-0"> <h3 class="text-sm font-semibold leading-6 text-white">
Legal
</h3> <ul role="list" class="mt-6 space-y-4"> <li> <a href="/privacy-policy/" class="text-sm leading-6 text-gray-300 hover:text-white"> Privacy Policy </a> </li><li> <a href="/terms-of-service/" class="text-sm leading-6 text-gray-300 hover:text-white"> Terms of Service </a> </li> </ul> <h3 class="mt-6 text-sm font-semibold leading-6 text-white">
Compare
</h3> <ul role="list" class="mt-6 space-y-4"> <li> <a href="/blog/best-screenshot-apis/" class="text-sm leading-6 text-gray-300 hover:text-white"> The best screenshot API </a> </li><li> <a href="/comparisons/puppeteer-alternative-for-screenshots" class="text-sm leading-6 text-gray-300 hover:text-white"> Puppeteer alternative </a> </li> </ul> </div> </div> </div> </div> <div class="mt-16 border-t border-white/10 pt-8 sm:mt-20 lg:mt-24"> <p class="text-xs leading-5 text-gray-400">
© 2022-2024 ScreenshotOne.com. All rights
                reserved.
</p> </div> </div> </footer> <div aria-live="polite" class="crisp-client"><div class="cc-rukbw"><div class="cc-9yvsj"><style type="text/css">.crisp-client *:focus-visible {
  outline-color: #3B0F89 !important;
}

.crisp-client .cc-1brb6 .cc-co79q {
  color: #FFFFFF !important;
}

.crisp-client .cc-1brb6 .cc-1dvce {
  color: #682AD5 !important;
}

.crisp-client .cc-1brb6 .cc-5t1tm {
  background-color: #FFFFFF !important;
}

.crisp-client .cc-1brb6 .cc-1q2sq {
  background-color: #3B0F89 !important;
}

.crisp-client .cc-1brb6 .cc-62iw4 {
  background-color: #581FBB !important;
}

.crisp-client .cc-1brb6 .cc-1kgzy {
  background-color: #682AD5 !important;
}

.crisp-client .cc-1brb6 .cc-1kgzy *:focus-visible {
  outline-color: #F0F2F5 !important;
}

.crisp-client .cc-1brb6 .cc-m59gn {
  background-color: #F6F5FA !important;
}

.crisp-client .cc-1brb6 .cc-jtuj4 {
  background-color: #F0F2F5 !important;
}

.crisp-client .cc-1brb6 .cc-1ikmr {
  border-color: #FFFFFF !important;
}

.crisp-client .cc-1brb6 .cc-1i61z,
.crisp-client .cc-1brb6 .cc-134r8:hover {
  border-color: #682AD5 !important;
}

.crisp-client .cc-1brb6 .cc-un6tk {
  border-color: rgba(104, 42, 213, 0.2) !important;
}

.crisp-client .cc-1brb6 .cc-weiiy {
  border-bottom-color: #682AD5 !important;
}

.crisp-client .cc-1brb6 .cc-18tkz::placeholder {
  color: #92A9C1 !important;
}

.crisp-client .cc-1brb6 .cc-10xgc::placeholder {
  color: #92A9C1 !important;
}

.crisp-client .cc-1brb6 .cc-y2afy,
.crisp-client .cc-1brb6 .cc-y2afy:active,
.crisp-client .cc-1brb6 .cc-1swm7:hover .cc-17cww,
.crisp-client .cc-1brb6 .cc-1swm7 .cc-17cww:active {
  background: #3B0F89 !important;
}

.crisp-client .cc-1brb6 .cc-coh7k,
.crisp-client .cc-1brb6 .cc-1cx9a:hover,
.crisp-client .cc-1brb6 .cc-1xhex[data-active="true"] .cc-ydjl9 {
  background: #5019B0 !important;
}

.crisp-client .cc-1brb6 .cc-y2afy:hover,
.crisp-client .cc-1brb6 .cc-coh7k:hover,
.crisp-client .cc-1brb6 .cc-1cx9a:active {
  background: #441599 !important;
}

.crisp-client .cc-1brb6 .cc-coh7k:active {
  background: #3B0F89 !important;
}

.crisp-client .cc-1brb6 .cc-aoc5z:hover .cc-fajgc {
  background: #5019B0 !important;
}

.crisp-client .cc-1brb6 .cc-aoc5z .cc-fajgc:active {
  background: #441599 !important;
}

.crisp-client .cc-1brb6 .cc-f5i1a,
.crisp-client .cc-1brb6 .cc-70ynx:hover .cc-iuh54,
.crisp-client .cc-1brb6 .cc-70ynx .cc-iuh54:active {
  background: #682AD5 !important;
}

.crisp-client .cc-1brb6 .cc-f5i1a:hover {
  background: #581FBB !important;
}

.crisp-client .cc-1brb6 .cc-f5i1a:active {
  background: #5019B0 !important;
}

.crisp-client .cc-1brb6 .cc-vibqn::selection,
.crisp-client .cc-1brb6 .cc-vibqn *::selection {
  color: #1c293b !important;
  background-color: #EDE2FF !important;
}</style></div><div class="cc-k4lmp"><style type="text/css">.crisp-client .cc-1brb6 {
  z-index: 1000000;
}</style></div></div><div id="crisp-chatbox" lang="en" dir="ltr" translate="no" tabindex="-1" class="cc-1brb6" data-hidden="false" data-force-show="false" data-color-mode="light" data-availability="online" data-lock-maximized="false" data-website-logo="false" data-last-operator-face="false" data-ongoing-operator-face="false" data-availability-tooltip="false" data-hide-vacation="false" data-blocked="false" data-mobile-view="false" data-full-view="false" data-small-view="true" data-large-view="false" data-has-local-messages="false" data-was-availability-online="true" data-is-activity-ongoing="false" data-hide-on-away="false" data-hide-on-mobile="false" data-position-reverse="false"><div class="cc-1yy0g cc-1wive cc-vibqn"><a data-maximized="false" data-is-failure="false" class="cc-1m2mf" tabindex="0" role="button" aria-label="Open chat" data-pane-animate-entrance="true" data-pop="minimized:open"><span class="cc-6lwfw"><!--v-if--></span><span class="cc-157aw cc-1kgzy"><span data-id="chat_closed" data-is-ongoing="false" class="cc-d73fc"><span class="cc-1bvfm cc-hshc7"><!--v-if--></span></span></span></a></div></div></div></body></html>