> ## Documentation Index
> Fetch the complete documentation index at: https://docs.magic.link/llms.txt
> Use this file to discover all available pages before exploring further.

# Transaction Signing

## Overview

Magic offers out-of-the-box UI for Transaction Signing. This UI will be presented to the user whenever the `sendTransaction` EVM RPC method is called with a web3 provider library such as  `ethers.js`.

<Frame>
  <img src="https://mintcdn.com/magic-newton/mA7B4icGsHcK07ZQ/images/image-8.webp?fit=max&auto=format&n=mA7B4icGsHcK07ZQ&q=85&s=955be7a9582aee392ac2b838492a64a9" alt="image-8" width="800" height="584" data-path="images/image-8.webp" />
</Frame>

Once the method is invoked, Magic will provide information about the transaction, and the cost including estimated gas fees.

<Frame>
  <img src="https://mintcdn.com/magic-newton/mA7B4icGsHcK07ZQ/images/image-6.webp?fit=max&auto=format&n=mA7B4icGsHcK07ZQ&q=85&s=62c7a5fbfa37a47b837a4467d79af5c6" alt="image-6" width="800" height="603" data-path="images/image-6.webp" />
</Frame>

### Compatibility

* Transaction Signing UI is disabled by default and can be enabled within the developer dashboard in Customization -> Widget UI. Magic also offers [Sign Confirmation](/embedded-wallets/wallets/security/sign-confirmation), a feature that secures users from front-end attacks, by prompting them to confirm the transaction in a Magic-hosted tab after clicking "Send".

### Use Cases

* Requesting signatures from users for any transaction on the [supported networks](/embedded-wallets/blockchains/overview)

### Usage

⁠Once you have verified the correct setup of the Magic SDK and successfully authenticated the user, you can proceed to send a request that invokes the Transaction Signature UI: ⁠

<CodeGroup>
  ```javascript Ethers (v6) icon="square-js" theme={null}
  import { ethers } from 'ethers';
  import { Magic } from 'magic-sdk';

  const magic = new Magic('YOUR_PUBLISHABLE_API_KEY');
  const provider = new ethers.BrowserProvider(magic.rpcProvider);

  const signer = await provider.getSigner();

  const txnParams = {
    to: toAddress,
    value: ethers.parseUnits('0.001', 'ether'),
  };

  const tx = await signer.sendTransaction(txnParams);

  console.log(tx);
  ```

  ```javascript Ethers (v5) icon="square-js" theme={null}
  import { ethers } from 'ethers';
  import { Magic } from 'magic-sdk';

  const magic = new Magic('YOUR_PUBLISHABLE_API_KEY');
  const provider = new ethers.providers.Web3Provider(magic.rpcProvider);

  const signer = provider.getSigner();

  const txnParams = {
    to: toAddress,
    value: ethers.utils.parseUnits('0.001', 'ether')
  };

  const tx = await signer.sendTransaction(txnParams);

  console.log(tx);
  ```
</CodeGroup>

#### Configuration

See how to brand this experience with your own logo and colors in the [customization section](/embedded-wallets/wallets/customization/brand-and-theme).

### Resources

* [Quickstart](/embedded-wallets/quickstart/overview)
* [Supported EVM RPC Methods](/embedded-wallets/sdk/client-side/javascript#evm-rpc-methods)