27 feedback buttonsyou can paste today
Plain HTML and CSS, no framework, and every preview is live: click one and the real modal opens. Take the styling even if you never take the product.
Two lines, then any element works
The script goes in once. After that the attribute turns anything (a button, a link, a list item) into a trigger, and your own markup and styling are left alone.
<script src="https://feedfa.st/embed.js" data-project="your-project" defer></script>Swap your-project for your slug and the buttons below start posting to your board. Class names are namespaced, so nothing here collides with your own CSS. The docs cover identifying the signed-in user, prefilling the form from an error page, and opening the modal from your own code.
Buttons
Solid
The default. Put it anywhere a primary action belongs.
Soft
For pages that already have a primary button competing for attention.
Ghost
Quiet enough for a toolbar, a header, or a row of secondary actions.
Ink
Neutral and confident. Works on any brand colour because it has none.
Gradient
When the rest of the page is already loud enough to carry it.
Icon only
For a dense toolbar. Keep the aria-label: the icon is not a name.
With a beta badge
Says why you are asking, which is most of why people answer.
Full width
Sized to its container, for a sidebar or a narrow column.
Dark
For a dashboard that is already dark. Same trigger, different clothes.
With a shortcut hint
Pair it with your own key handler calling Feedfast.openFeedback().
Outlined
A hairline border and squarer corners, for interfaces that are not all pills.
Statement
Brutalist
Thick lines, a hard shadow, and a press you can feel. Loud on purpose.
Keycap
A raised edge that sinks when pressed. Friendly, a little game-like.
Gradient ring
Colour on the border only, so it stands out without shouting.
Neon
A glowing terminal outline for dev tools and dark dashboards.
Glass
Frosted over a photo or a gradient hero. Needs something behind it.
Speech bubble
Rounded type and a tail in one corner. Reads as a conversation, not a form.
Editorial
Serif italic with an arrow, for a blog, a newsletter or a publication.
Sticker
Tilted, dashed, warm. For a side project or a beta that wants to feel human.
Anchored
Side tab
Always there, never in the way. The classic support-widget shape.
Floating action button
Bottom-right, out of the layout entirely. Good for an app shell.
Expanding button
An icon until someone reaches for it, then it says what it does.
Bottom dock
A floating pill, bottom centre, that asks a question instead of naming a form.
In context
Footer link
No button at all. Sits happily in a row of legal links.
Prompt card
For an empty state or the end of a docs page, where a bare button reads as noise.
Missing something?
Tell us what you were looking for. It goes straight onto our public roadmap.
Was this helpful?
The end of a docs page. Each answer opens the form with its own title filled in.
Where to put a feedback button
Do you need one at all? If people use your product and you want to hear from them, yes. Where it sits decides whether anyone clicks it.
- 01
Inside the product, not only the landing page
The people with a useful opinion are the ones using the thing. On a marketing page a feedback button mostly collects support questions; inside the app it collects requests.
- 02
Somewhere it can wait
A button that sits still until someone has something to say beats a popup on page load. A side tab or a floating button is always there and never in the way. Example: Side tab.
- 03
One corner, not two
If a chat widget already owns the bottom right, don't stack a floating button on top of it. Use the other corner, a side tab, or the menu. Example: Floating action button.
- 04
In the menu people already open
The account or help menu is where people look when they want to tell you something. A menu item there costs no screen space at all. Example: Menu item.
- 05
Next to the moment
Ask on an error page, an empty state, or right after a task finishes. Feedback asked for in context is more specific than feedback asked for in general. Example: Prompt card.
- 06
A label that says what you want
“Request a feature” and “Report a bug” get more specific answers than “Feedback”. A badge that says why you're asking (it's in beta) gets more answers still. Example: With a beta badge.
Want the whole modal in your own markup instead? Build a custom feedback modal on the same API, or try every skin in the widget playground.
The buttons are free. So is the board.
One project, unlimited feedback, votes and comments on the free plan. Paste a button, get your first request the same day.