> For the complete documentation index, see [llms.txt](https://docs.secuuth.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.secuuth.io/integration/htms-and-js.md).

# HTML

**Step 1: Add Secqure JS SDK**

```
<!-- Get Secqure JS SDK -->
<script
    src="https://dev.secuuth.io/JS/prod/Secuuth.bundle.js"
    type="text/javascript"
></script>
```

**Step 2: Add a div element**

```
<div id="secuuthForm"></div>
```

**Step 3: Invoke Secqure**

```
const secuuth = new Secuuth({
      // Key Id obtained while creating Project in Dashboard
      keyId: "xxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
      // Name of the Form
      profileName: "Default",
      // Div id created in above step
      containerId: "secuuthForm",
      onSubmit: (payload) => {
      // Send payload to your backend server
      })
```

The above steps render  your Login form

<img src="/files/fiJbrrx43YNsJzPlJkr1" alt="" data-size="original">

Secqure returns tokens as part of the payload. Your backend server should validate the access and Id tokens and extract information. Use [SDKs](/backend-response-handling-sdks.md) to validate tokens

```
{
  "accessToken": "eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIi...",
  "idToken": "eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiJi...",
  "refreshToken": "ad40e2af38f35937bc702cd8bd9c5c3d0af1aad460df..."
}
```

**Congratulations... You are done!!!**