Skip to main content
React Turnstile Preview

What is React Turnstile?

React Turnstile is a React component library that provides seamless integration with Cloudflare Turnstile, a privacy-focused CAPTCHA alternative. It enables you to add smart verification to your React applications with minimal user interaction.

Key Features

Smart Verification

Minimal user interaction required for verification

Privacy-Focused

CAPTCHA alternative that respects user privacy

Automatic Script Injection

Automatically loads and manages the Turnstile script

SSR Ready

Full support for server-side rendering

TypeScript Support

Complete type definitions included

Imperative API

Control widgets programmatically via refs

Multiple Widgets

Support for multiple widget instances

Customizable

Customize appearance and behavior

Quick Example

Here’s a simple example of using React Turnstile:
import { Turnstile } from '@marsidev/react-turnstile'

function MyForm() {
  return (
    <form>
      <input type="email" placeholder="Email" />
      <Turnstile siteKey="1x00000000000000000000AA" />
      <button type="submit">Submit</button>
    </form>
  )
}

Get Started

Installation

Install React Turnstile in your project

Quickstart

Get up and running in minutes

API Reference

Explore the complete API

Examples

View real-world examples

Why Turnstile?

Cloudflare Turnstile is a CAPTCHA replacement that:
  • Reduces user friction — Most users complete verification without any interaction
  • Protects privacy — No personal data collection or tracking
  • Works everywhere — Compatible with all modern browsers
  • Easy to integrate — Simple setup with minimal configuration

Community & Support

GitHub

View source code and report issues

npm

View package on npm

Build docs developers (and LLMs) love