Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub


NPM Package License - MIT

A Gatsby plugin to easily integrate Cloudflare Turnstile client-side.


yarn add gatsby-plugin-turnstile

and add it to your gatsby-config.js with your Turnstile site key.

  plugins: [
      resolve: 'gatsby-plugin-turnstile',
      options: {
        siteKey: `${YOUR_SITE_KEY}`,

Retrieve Site Key

You can use site key you set to gatsby-config. It’s provided via static query under the hood.

import { useTurnstileSiteKey } from 'gatsby-plugin-turnstile/src';

const mySiteKey = useTurnstileSiteKey();

Use this key to protect your form.

Use Turnstile API

This plugin provide loader and type definitions for window.turnstile API.

You can await to window.turnstile ready state. For example,

await Promise.race(
  window.turnstileReady, // Promise object set by the plugin
  new Promise(res => setTimeout(res, 1000)),



© 2023 Gatsby, Inc.