Auth request
Authentication request to my.app
Also known as a magic link, email authentication is a passwordless flow where users click a unique link sent to their email address to log in.
Magic link input element
<h1>MyApp Login Form</h1>
<np-login></np-login>
<script type="module">
const input = document.querySelector("np-login");
input.addEventListener("np:login", async (e) => {
// You are authenticated 🎉
const { expires_at, token } = await e.target.getSession();
});
</script>Authentication request to my.app
FFFF
FFFFFFFFFFFFFF
FFFFFFFF
Based on FIDO Alliance and W3C standards, passkeys replace passwords with a cryptographic key that is unlocked only with the user's device.
Passkey authentication input element
<np-login></np-login>
<script type="module">
const npLogin = document.querySelector("np-login");
npLogin.addEventListner("np:login", async (e) => {
// Your are authenticated 🎉
const { expires_at, token } = await e.target.getSession();
});
</script>Use passkey for this website
Customize Nopwd components extensively using CSS parts. This allows you to control the theming and styling for each element state.
np-logout:not([state])::part(button) {
color: white;
background-color: black;
}Effortlessly override strings for any element to localize to any language or customize the wording to fit your brand.
<np-logout>
Log out
<span slot="loggingout">Logging out...</span>
<span slot="loggedout">Congratulations</span>
</np-logout>Configure the duration of a local session initiated during the login process.
<!-- 'lifetime' equals to one day (24h) by default -->
<np-login></np-login>
Step into a Password-Free Future and experience the ease of Passwordless Authentication today!