diff --git a/.github/styles/config/vocabularies/default/accept.txt b/.github/styles/config/vocabularies/default/accept.txt
index 420dc2e37..012784cdf 100644
--- a/.github/styles/config/vocabularies/default/accept.txt
+++ b/.github/styles/config/vocabularies/default/accept.txt
@@ -59,6 +59,7 @@
[Oo]nboarding
[Oo]nchain
[Oo]nramp
+[Oo]penfort
[Pp]ermissionless
[Pp]olygon
[Pp]ostgres
diff --git a/pages/sdk/signers.mdx b/pages/sdk/signers.mdx
index c99db3821..f2486d327 100644
--- a/pages/sdk/signers.mdx
+++ b/pages/sdk/signers.mdx
@@ -12,6 +12,7 @@ The following guides show how to create a signer account with different service
- [Dynamic](./signers/dynamic.mdx)
- [Magic](./signers/magic.mdx)
+- [Openfort](./signers/openfort.mdx)
- [Passkeys](./signers/passkeys.mdx)
- [Privy](./signers/privy.mdx)
- [Web3Auth](./signers/web3auth.mdx)
diff --git a/pages/sdk/signers/_meta.json b/pages/sdk/signers/_meta.json
index 9f66bf9c3..f0aee8470 100644
--- a/pages/sdk/signers/_meta.json
+++ b/pages/sdk/signers/_meta.json
@@ -1,6 +1,7 @@
{
"dynamic": "Dynamic",
"magic": "Magic",
+ "openfort": "Openfort",
"passkeys": "Passkeys",
"privy": "Privy",
"web3auth": "Web3Auth"
diff --git a/pages/sdk/signers/openfort.mdx b/pages/sdk/signers/openfort.mdx
new file mode 100644
index 000000000..ec447860c
--- /dev/null
+++ b/pages/sdk/signers/openfort.mdx
@@ -0,0 +1,203 @@
+
+
+import { Tabs, Steps, Callout } from 'nextra/components'
+
+# Openfort Signer
+
+In this guide, you will learn how to create an [Openfort](https://openfort.io) signer that can be added as a Safe owner and used to initialize any of the kits from the Safe\{Core\} SDK.
+
+Check out the [Safe Signers demo app](https://github.com/5afe/safe-signers) on GitHub to follow along this guide with the completed code.
+
+## Prerequisites
+
+- [Node.js and npm](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm).
+- An [Openfort account](https://dashboard.openfort.io) with a publishable key and Shield publishable key.
+
+## Install dependencies
+
+{/* */}
+
+
+
+ ```bash
+ npm install @openfort/react @tanstack/react-query wagmi viem
+ ```
+
+
+ ```bash
+ yarn add @openfort/react @tanstack/react-query wagmi viem
+ ```
+
+
+ ```bash
+ pnpm add @openfort/react @tanstack/react-query wagmi viem
+ ```
+
+
+
+{/* */}
+
+## Steps
+
+
+
+ ### Imports
+
+ Here are the necessary imports for this guide.
+
+ {/* */}
+
+ ```typescript
+ import { OpenfortProvider, OpenfortButton, useUser, useWallets, useOpenfort, AccountTypeEnum, AuthProvider, getDefaultConfig } from '@openfort/react'
+ import { WagmiProvider, createConfig } from 'wagmi'
+ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+ import { createWalletClient, custom } from 'viem'
+ import { sepolia } from 'viem/chains'
+ ```
+
+ {/* */}
+
+ ### Get the API Keys
+
+ Create a new project in the [dashboard](https://dashboard.openfort.io) and get its publishable key.
+
+ You will also need to get your Shield publishable key from the [Shield configuration](https://www.openfort.io/docs/products/embedded-wallet/react#shield-configuration).
+
+ Once you have them, you need to initialize the following variables:
+
+ {/* */}
+
+ ```typescript
+ const OPENFORT_PUBLISHABLE_KEY = // ...
+ const SHIELD_PUBLISHABLE_KEY = // ...
+ ```
+
+ {/* */}
+
+ ### Configure wagmi and React Query
+
+ Openfort requires wagmi and React Query to be configured. Set up the wagmi configuration and create a query client:
+
+ {/* */}
+
+ ```typescript
+ const wagmiConfig = createConfig(
+ getDefaultConfig({
+ appName: 'Safe Signers Demo',
+ chains: [sepolia],
+ ssr: true
+ })
+ )
+
+ const queryClient = new QueryClient()
+ ```
+
+ {/* */}
+
+ ### Initialize Openfort
+
+ Openfort works with React hooks. This means you can wrap your app with the `OpenfortProvider`, `WagmiProvider`, and `QueryClientProvider` to have access to several React hooks like `useUser()` or `useWallets()` that will provide all the functionality.
+
+ `OpenfortProvider` receives a `publishableKey`, `walletConfig` with the Shield configuration, and `uiConfig` with authentication options. Check [Openfort React SDK documentation](https://www.openfort.io/docs/products/embedded-wallet/react) to learn more about all the different configuration options.
+
+ {/* */}
+
+ ```typescript
+
+
+
+
+
+
+
+ ```
+
+ {/* */}
+
+ In this guide you will use the following variables and methods from the Openfort React hooks:
+
+ {/* */}
+
+ ```typescript
+ const { isAuthenticated } = useUser()
+ const { wallets } = useWallets()
+ const { client } = useOpenfort()
+ ```
+
+ {/* */}
+
+ ### Login
+
+ Openfort provides a pre-built UI component that handles authentication. Simply add the `` component to your app:
+
+ {/* */}
+
+ ```typescript
+
+ ```
+
+ {/* */}
+
+ This button provides a user-friendly interface for logging in using the authentication methods configured in your `OpenfortProvider` (email, Google, guest, etc.). The authentication state will be automatically managed by Openfort's React hooks.
+
+ ### Get the provider and signer
+
+ Once the user is logged in, you can get the `provider` and `signer`, which is the externally-owned account of the user that was derived from its credentials.
+
+ To do that there is a `useEffect()` that is executed when the `isAuthenticated` and `wallets` variables have their values updated. Once `isAuthenticated` is `true` and `wallets` has a length greater than zero, you have access to the user's connected signer.
+
+ {/* */}
+
+ You can instantiate the provider using `viem` and get the signer address like so:
+
+ ```typescript
+ useEffect(() => {
+ const init = async () => {
+ if (isAuthenticated && wallets.length > 0) {
+ const ethereumProvider = await client.embeddedWallet.getEthereumProvider()
+
+ const provider = createWalletClient({
+ chain: sepolia,
+ transport: custom(ethereumProvider)
+ })
+
+ const signer = wallets[0].address
+ }
+ }
+ init()
+ }, [isAuthenticated, wallets])
+ ```
+
+ {/* */}
+
+ With the `provider` and `signer` you are ready to instantiate any of the kits from the Safe\{Core\} SDK and set up or use this signer as a Safe owner.
+
+ ### Logout
+
+ The `` component automatically handles logout functionality. When the user is authenticated, the button will display logout options.
+
+
+
+## Recap and further reading
+
+After following this guide, you are able to create a Safe signer using Openfort and get the `provider` and `signer` required to initialize the kits from the Safe\{Core\} SDK.
+
+Learn more about Openfort by checking the following resources:
+
+- [Openfort website](https://openfort.io)
+- [Openfort documentation](https://www.openfort.io/docs)
+- [Openfort embedded wallet quickstart](https://www.openfort.io/docs/products/embedded-wallet/react)
+