---
id: auth-email
title: 'Login With Email'
description: Use Supabase to Authenticate and Authorize your users using email.
---

import Tabs from '@theme/Tabs'
import TabItem from '@theme/TabItem'

## Overview

Setting up Email logins for your Supabase application.

- Add Email authenticator to your [Supabase Project](https://app.supabase.com)
- Add the login code to your application - [JavaScript](https://github.com/supabase/supabase-js) | [Dart](https://github.com/supabase/supabase-dart)

## Configure email settings

- Go to your [Supabase Project Dashboard](https://app.supabase.com)
- In the left sidebar, click the `Authentication` icon (near the top)
- Click `Settings` from the list to go to the `Authentication Settings` page
- Enter the final (hosted) URL of your app under `Site URL`
- Under `Email Auth` turn `Enable Email Signup` to ON
- Click `Save`

:::note Self hosting

For self-hosting, you can update your project configuration using the files and environment variables provided.
See the [self-hosting docs](/docs/guides/hosting/overview#configuration) for details.

:::

### Add login code to your client app

Add logins using our client libraries:

- [JavaScript](/docs/reference/javascript/auth-signin#sign-in-with-email)
- [Dart](/docs/reference/dart/auth-signin#sign-in-with-email)

<Tabs
  defaultValue="js"
  groupId="guides/auth"
  values={[{ label: 'JavaScript', value: 'js' }, { label: 'Dart', value: 'dart' }]}
>

<TabItem value="js">

```js
const { user, error } = await supabase.auth.signIn({
  email: 'example@email.com',
  password: 'example-password',
})
```

</TabItem>

<TabItem value="dart">

```dart
final res = await supabase.auth.signIn(
  email: 'example@email.com',
  password: 'example-password'
);

final user = res.data?.user;
final error = res.error;
```

</TabItem>

</Tabs>

Add this function which you can call from a button, link, or UI element.

<Tabs
  defaultValue="js"
  groupId="guides/auth"
  values={[{ label: 'JavaScript', value: 'js' }, { label: 'Dart', value: 'dart' }]}
>

<TabItem value="js">

```js
async function signInWithEmail() {
  const { user, error } = await supabase.auth.signIn({
    email: 'example@email.com',
    password: 'example-password',
  })
}
```

</TabItem>

<TabItem value="dart">

```dart
Future<void> signInWithEmail() async {
  await supabase.auth.signIn(
    email: 'example@email.com',
    password: 'example-password'
  );
}
```

</TabItem>

</Tabs>

To log out:

<Tabs
  defaultValue="js"
  groupId="guides/auth"
  values={[{ label: 'JavaScript', value: 'js' }, { label: 'Dart', value: 'dart' }]}
>

<TabItem value="js">

```js
async function signOut() {
  const { error } = await supabase.auth.signOut()
}
```

</TabItem>

<TabItem value="dart">

```dart
Future<void> signOut() async {
   await supabase.auth.signOut();
}
```

</TabItem>

</Tabs>

## Resources

- [Supabase Account - Free Tier OK](https://supabase.com)
- [Supabase JS Client](https://github.com/supabase/supabase-js)
- [Supabase Dart Client](https://github.com/supabase/supabase-dart)