# magic-sdk

> Passwordless authentication for the web.

Latest version **33.13.0** (published 2026-09-01) · MIT license · 0 weekly downloads

## Install

```sh
npm install magic-sdk
pnpm add magic-sdk
yarn add magic-sdk
bun add magic-sdk
```

## Health

**Score 70/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 33.13.0 |
| Published | 2026-09-01 |
| First published | 2020-02-22 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 898.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (Unknown) |
| GitHub stars | 476 |
| Author | Magic Labs |
| Maintainers | ethella, jmjin, magiclabs_fe, jasonatmagic, josh_scanlan, noahyoshida, ernieyang09, oxyn-magic, seanli |

## Links

- npm: https://www.npmjs.com/package/magic-sdk
- Repository: https://github.com/magiclabs/magic-js
- Homepage: https://magic.link
- Issues: https://github.com/magiclabs/magic-js/issues
- npm.io page: https://npm.io/package/magic-sdk

## Dependencies (3)

- [localforage](https://npm.io/package/localforage.md) ^1.7.4
- [@magic-sdk/types](https://npm.io/package/@magic-sdk/types.md) ^27.13.0
- [@magic-sdk/provider](https://npm.io/package/@magic-sdk/provider.md) ^33.13.0

## Recent versions

- 33.13.0 (latest) — 2026-09-01
- 33.13.0-canary.88f8a7c.0 (canary) — 2026-09-01
- 7.0.0-dgerrells-ch42053-sms-feature.0 (dgerrells-ch42053-sms-feature) — 2021-09-17
- 7.0.0-mfa-feature.1 (mfa-feature) — 2021-09-17
- 6.0.0-next.1 (next) — 2021-09-13
- 4.4.3-custom-session-duration.1 (custom-session-duration) — 2021-08-30
- 0.1.0-beta.14 (beta) — 2020-03-24
- 33.13.0-canary.1127.33539959419.0 — 2026-09-01
- 33.12.0 — 2026-08-26
- 33.12.0-canary.8ab4816.0 — 2026-08-26
- 33.12.0-canary.1125.32991648608.0 — 2026-08-26
- 33.11.0 — 2026-08-25
- 33.11.0-canary.5c46f47.0 — 2026-08-25
- 33.11.0-canary.1124.32876468895.0 — 2026-08-25
- 33.10.3-canary.1111.31717158054.0 — 2026-08-13
- … 1254 more at https://npm.io/package/magic-sdk/versions

## README

<p align="left">
  <a href="https://magic.link/docs/home/welcome">
    <img src="https://media.graphassets.com/T9TXZhcNRVm211eyMh3u" alt="Logo" width="270" height="auto">
  </a>
</p>

# Magic JavaScript SDK

[![<MagicLabs>](https://circleci.com/gh/magiclabs/magic-js.svg?style=shield)](https://circleci.com/gh/magiclabs/magic-js)

> The Magic JavaScript SDK empowers developers to provide frictionless web3 onboarding to their end-users while preserving their security and privacy using non-custodial wallets.

<p align="center">
  <a href="https://github.com/magiclabs/magic-js/blob/master/packages/magic-sdk/LICENSE">License</a> ·
  <a href="https://github.com/magiclabs/magic-js/blob/master/packages/magic-sdk/CHANGELOG.md">Changelog</a> ·
  <a href="https://github.com/magiclabs/magic-js/blob/master/CONTRIBUTING.md">Contributing Guide</a>
</p>

## 📖 Documentation

- See the [developer documentation](https://docs.magic.link) to learn how you can master the Magic SDK in a matter of minutes.
- See the `@magic-sdk/react-native-bare` [README](https://github.com/magiclabs/magic-js/tree/master/packages/%40magic-sdk/react-native-bare#readme) for Bare React Native package specific information.
- See the `@magic-sdk/react-native-expo` [README](https://github.com/magiclabs/magic-js/tree/master/packages/%40magic-sdk/react-native-expo#readme) for Expo React Native package specific information. 

## ⚡️ Quick Start

### Installation

Integrating your app with Magic will require our client-side NPM package: 

```bash
# Via NPM:
npm install --save magic-sdk # If you're targeting web browsers
npm install --save @magic-sdk/react-native-bare # If you're targeting Bare React Native
npm install --save @magic-sdk/react-native-expo # If you're targeting Expo React Native

# Via Yarn:
yarn add magic-sdk # If you're targeting web browsers
yarn add @magic-sdk/react-native-bare # If you're targeting Bare React Native
yarn add @magic-sdk/react-native-expo # If you're targeting Expo React Native
```

Alternatively, you can load via CDN by adding a script tag to your app’s `<head>`:

```html
<script src="https://cdn.jsdelivr.net/npm/magic-sdk/dist/magic.js"></script>
```

### Usage

Sign up or log in to the [developer dashboard](https://dashboard.magic.link) to receive API keys that will allow your application to interact with Magic's authentication APIs.

Then, you can start authenticating users with _just one method!_ Magic works across all modern desktop, mobile Chrome, Safari and Firefox browsers.

```ts
import { Magic } from "magic-sdk"
import Web3 from 'web3';

const magic = new Magic('YOUR_API_KEY', { 
  network: "goerli",
});

const web3 = new Web3(magic.rpcProvider);
const accounts = await magic.wallet.connectWithUI();
```

## 📦 Package Ecosystem

### Entry points

These are packages _you_ can install to enable Magic JS SDK functionality for your client-side application.

| Package Name | Changelog | Description |
| ------------ | --------- | ----------- |
| [`magic-sdk`](https://www.npmjs.com/package/magic-sdk) | [CHANGELOG](./CHANGELOG.md) | Web/browser entry-point for Magic SDK. |
| [`@magic-sdk/react-native-bare`](https://www.npmjs.com/package/@magic-sdk/react-native-bare) | [CHANGELOG](../@magic-sdk/react-native-bare/CHANGELOG.md) | Bare React Native entry-point for Magic SDK. |
| [`@magic-sdk/react-native-expo`](https://www.npmjs.com/package/@magic-sdk/react-native-expo) | [CHANGELOG](../@magic-sdk/react-native-expo/CHANGELOG.md) | Expo React Native entry-point for Magic SDK. |

## Extensions

Extend Magic JS SDK functionality for your use-case through [`@magic-ext/*` packages](../@magic-ext).

### Internals

These are packages Magic JS SDK uses internally to work seamlessly across platforms.

| Package Name | Changelog | Description |
| ------------ | --------- | ----------- |
| [`@magic-sdk/types`](https://www.npmjs.com/package/@magic-sdk/types) | [CHANGELOG](./packages/@magic-sdk/types/CHANGELOG.md) | Core typings shared between JavaScript entry-points of Magic SDK. |
| [`@magic-sdk/pnp`](https://www.npmjs.com/package/@magic-sdk/pnp) | [CHANGELOG](./packages/@magic-sdk/pnp/CHANGELOG.md) | A lightweight connector that wraps Magic JS authentication with a beautiful, functional out-of-the-box login form. |
| [`@magic-sdk/provider`](https://www.npmjs.com/package/@magic-sdk/provider) | [CHANGELOG](./packages/@magic-sdk/provider/CHANGELOG.md) | Core business logic shared between JavaScript entry-points of Magic SDK. |
| [`@magic-sdk/commons`](https://www.npmjs.com/package/@magic-sdk/commons) | [CHANGELOG](./packages/@magic-sdk/commons/CHANGELOG.md) | Exposes a listing of common public APIs from `@magic-sdk/provider` and `@magic-sdk/types` to the platform-specific entry points. |
| [`@magic-sdk/types`](https://www.npmjs.com/package/@magic-sdk/types) | [CHANGELOG](./packages/@magic-sdk/types/CHANGELOG.md) | Core typings for Magic SDK packages. |

## 🚦 Testing

Run tests for all packages 
```bash
yarn test
```

Test an individual package
```bash
PKG=magic-sdk yarn test
PKG=@magic-sdk/react-native-bare yarn test
PKG=@magic-sdk/react-native-expo yarn test
```

Test specific files
```bash
yarn test /test/**/constructor.spec.ts
```

---
_Source: https://npm.io/package/magic-sdk · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._