Free website feedback widget with
screenshots in 30 seconds
Open source bug reporting widget for any website. Drop it in, and user feedback becomes GitHub issues — with screenshots, annotations, and system info.
How It Works
Add One Script Tag
Install our GitHub App and paste the widget script into your HTML. No build step required.
Users Click the Bug Button
A floating button appears on your site. Users can capture screenshots and annotate issues.
Issues Created Automatically
Feedback is sent to your GitHub repo as a fully-formatted issue with screenshots and system info.
See It In Action
See BugDrop running on a real app
Features
Screenshot Capture
Full page or element-specific screenshots with automatic capture.
Annotation Tools
Draw, arrows, and rectangles to highlight exactly what's wrong.
Feedback Categories
Bug, Feature, or Question — automatically tagged with GitHub labels.
System Info
Browser, OS, viewport, and more captured automatically for debugging.
Fully Stylable
Fonts, colors, borders, shadows, radius — match any design system with data attributes.
Privacy First
No tracking, no cookies. URLs are redacted. Your data stays yours.
Styled to Match Your App
One widget, any design system. Customize fonts, colors, borders, and shadows with data-* attributes.
Quick Start
Get up and running in under a minute.
Install the GitHub App on your repository:
Add the script to your website (replace owner/repo with your repo):
<script src="https://bugdrop.neonwatty.workers.dev/widget.js"
data-repo="owner/repo"></script>That's it! Users can now submit feedback that becomes GitHub issues.
Configuration
| Attribute | Values | Default |
|---|---|---|
data-repo | owner/repo | required |
data-theme | light, dark, auto | auto |
data-position | bottom-right, bottom-left | bottom-right |
data-welcome | once, always, false/never | once |
data-color | Hex color (e.g. #FF6B35) | #14b8a6 |
data-button-dismissible | true, false | false |
data-button | true, false | true |
data-label | Any string (e.g. "?", "Report Issue") | Feedback |
Styling
| Attribute | Values | Default |
|---|---|---|
data-font | inherit, or font-family string | Space Grotesk |
data-radius | Pixels (e.g. 0, 8, 16) | 6 |
data-bg | CSS color (e.g. #fffef0) | theme default |
data-text | CSS color (e.g. #1a1a1a) | theme default |
data-border-width | Pixels (e.g. 4) | 1 |
data-border-color | CSS color | theme default |
data-shadow | soft, hard, none | soft |
See the full documentation for all options including JavaScript API, submitter info collection, CI testing, and version pinning.
Try it now!
Click the feedback button in the bottom-right corner to see BugDrop in action →