*feedback.tools
Sign InFree setup helpGet started

React Feedback Surveys

Lightweight React component library for in‑app feedback surveys

How would you rate your satisfaction with our product?
Very dissatisfied
Very satisfied
How happy are you with your purchase?
Not at all
Extremely
Was this article helpful?
No
Yes
How easy was it to complete your task?
1
2
3
4
5
6
7
Very difficult
Very easy
How likely are you to recommend us to a friend?
0
1
2
3
4
5
6
7
8
9
10
Not likely
Very likely
  • Send responses to your own backend with zero lock-in
  • Tiny bundle, zero dependencies
  • Mobile-ready and style-isolated

Installation

Install the package using npm:

npm i react-feedback-surveys

or yarn:

yarn add react-feedback-surveys

Styles

Import the base styles in your app:

import 'react-feedback-surveys/index.css';

Prompt

Paste into Cursor, Claude Code, or any coding agent:

Add the "react-feedback-surveys" library to this project to collect user feedback.
Read the docs at https://feedback.tools/react-feedback-surveys/docs first, then:
1. Install it: npm i react-feedback-surveys
2. Import the styles once: import 'react-feedback-surveys/index.css'
3. Ask me which survey type I want — CSAT (2 or 5 points), NPS (0–10), or CES (7 points) — and render the matching component (CSAT2Survey, CSAT5Survey, NPS10Survey, or CES7Survey).
4. Wire up onScoreSubmit / onFeedbackSubmit to send responses to my backend.

Usage

import { CSAT5Survey } from 'react-feedback-surveys';
import 'react-feedback-surveys/index.css';

<CSAT5Survey
  scaleStyle="emoji"
  question="How would you rate your satisfaction with our product?"
  minLabel="Very unsatisfied"
  maxLabel="Very satisfied"
  responseType="text"
  textQuestion="We'd love to hear your thoughts — what can we improve?"
  textButtonLabel="Send"
  thankYouMessage="Thanks for your feedback!"
  onScoreSubmit={({ value }) => {/* ... */}}
  onFeedbackSubmit={({ value, comment }) => {/* ... */}}
/>

Capture survey responses using the onScoreSubmit callback for ratings and onFeedbackSubmit for follow-up text or choices.

Features

  • CSAT surveys

    Customer Satisfaction Score with 2 or 5 point scales. Measure how satisfied users are with your product or feature.

  • NPS surveys

    Net Promoter Score from 0–10. Measure user loyalty and likelihood to recommend your product.

  • CES surveys

    Customer Effort Score on a 7 point scale. Track how easy or difficult it was for users to complete tasks.

  • Multiple scale styles

    Choose between emoji, stars, numbers, or thumbs for ratings. Different questions work better with different formats.

  • Flexible placement

    Embed surveys inline with your content or display them as popup overlays. Control timing and positioning.

  • Follow-up feedback

    Add optional text input or multiple choice questions after ratings to get context on scores.

  • Fully customizable

    CSS variables and custom class names

  • Zero dependencies

    Built with just React—no external UI libraries required. Won't add extra weight to your bundle.

  • TypeScript support

    Built with full type support for autocomplete and type checking throughout.

Join the community

This is an open source project. If you find bugs, want to suggest features, or improve the code, we'd love to hear from you. Issues and pull requests welcome.

View on GitHubnpm Package

Docs