diff --git a/docs/guide/floating.md b/docs/guide/floating.md
index 64338f9..1246612 100644
--- a/docs/guide/floating.md
+++ b/docs/guide/floating.md
@@ -3,7 +3,7 @@
 Cap can automatically hide the captcha until the form is submitted. To use this feature, add the `data-cap-floating` attribute to the Cap widget with the query selector of the `cap-widget` element you want to use.
 
 ```html
-<cap-widget id="floating" onsolve="alert(`Verification token: ${event.detail.token}`)" cap-api-endpoint="<api endpoint>"></cap-widget>
+<cap-widget id="floating" onsolve="alert(`Verification token: ${event.detail.token}`)" data-cap-api-endpoint="<api endpoint>"></cap-widget>
 
 <button data-cap-floating="#floating" data-cap-floating-position="bottom">Trigger floating mode</button>
 ```
diff --git a/docs/guide/index.md b/docs/guide/index.md
index 306a4cc..36fc14f 100644
--- a/docs/guide/index.md
+++ b/docs/guide/index.md
@@ -16,20 +16,20 @@ Start by adding it from a CDN:
 Next, add the `<cap-widget>` component to your HTML.
 
 ```html
-<cap-widget id="cap" cap-api-endpoint="<your cap api endpoint>"></cap-widget>
+<cap-widget id="cap" data-cap-api-endpoint="<your cap api endpoint>"></cap-widget>
 ```
 
-**Note:** You'll need to start a server with the Cap API running at the same URL as specified in the `cap-api-endpoint` attribute. In the server-side example we provided, it's set to `/api`, but you can change this by replacing every `app.post('/api/...', ...)` to `app.post('/<endpoint>/...', ...)`.
+**Note:** You'll need to start a server with the Cap API running at the same URL as specified in the `data-cap-api-endpoint` attribute. In the server-side example we provided, it's set to `/api`, but you can change this by replacing every `app.post('/api/...', ...)` to `app.post('/<endpoint>/...', ...)`.
 
 > [!NOTE]
-> You'll need to start a server with the Cap API running at the same URL as specified in the `cap-api-endpoint` attribute.
+> You'll need to start a server with the Cap API running at the same URL as specified in the `data-cap-api-endpoint` attribute.
 > In the server-side example we provided, it's set to `/api`, but you can change this by replacing every `app.post('/api/...', ...)` to `app.post('/<endpoint>/...', ...)`.
 
 
 > [!TIP]
 > The following attributes are supported:
 > 
-> * `cap-api-endpoint`: API endpoint (required)
+> * `data-cap-api-endpoint`: API endpoint (required)
 > * `data-cap-worker-count`: Number of workers to use (defaults to `navigator.hardwareConcurrency || 8`)
 
 Then, in your JavaScript, listen for the `solve` event to capture the token when generated:
@@ -49,7 +49,7 @@ Alternatively, you can use `onsolve=""` directly within the widget or wrap the w
 
 
 ## Server-side
-Cap is fully self-hosted, so you'll need to start a server with the Cap API running at the same URL as specified in the `cap-api-endpoint` attribute. This is easy since we've already pre-made a library to help you generate and validate challenges for you.
+Cap is fully self-hosted, so you'll need to start a server with the Cap API running at the same URL as specified in the `data-cap-api-endpoint` attribute. This is easy since we've already pre-made a library to help you generate and validate challenges for you.
 
 Start by installing it using npm or bun: