Figma
Get your Credentials
- Sign in to your Figma account and go to the Developer Apps page
- Click "Create new app"
- Fill out the app details (name, description, etc.)
- Configure your redirect URI (e.g.,
https://yourdomain.com/api/auth/callback/figma
) - Note your Client ID and Client Secret
- The default scope is
file_read
. For additional scopes likefile_write
, refer to the Figma OAuth documentation.
Make sure to set the redirect URI to match your application's callback URL. If you change the base path of the auth routes, you should update the redirect URI accordingly.
Configure the provider
To configure the provider, you need to import the provider and pass it to the socialProviders
option of the auth instance.
import { betterAuth } from "better-auth"
export const auth = betterAuth({
socialProviders: {
figma: {
clientId: process.env.FIGMA_CLIENT_ID as string,
clientSecret: process.env.FIGMA_CLIENT_SECRET as string,
clientKey: process.env.FIGMA_CLIENT_KEY as string,
},
},
})
Sign In with Figma
To sign in with Figma, you can use the signIn.social
function provided by the client. The signIn
function takes an object with the following properties:
provider
: The provider to use. It should be set tofigma
.
import { createAuthClient } from "better-auth/client"
const authClient = createAuthClient()
const signIn = async () => {
const data = await authClient.signIn.social({
provider: "figma"
})
}
For more information about Figma's OAuth scopes and API capabilities, refer to the official Figma API documentation.