diff --git a/packages/css/src/components/figure/README.md b/packages/css/src/components/figure/README.md
new file mode 100644
index 0000000000..ab10c2a3cf
--- /dev/null
+++ b/packages/css/src/components/figure/README.md
@@ -0,0 +1,3 @@
+<!-- @license CC0-1.0 -->
+
+# Figure
diff --git a/packages/css/src/components/figure/figure.scss b/packages/css/src/components/figure/figure.scss
new file mode 100644
index 0000000000..5e6b1ce775
--- /dev/null
+++ b/packages/css/src/components/figure/figure.scss
@@ -0,0 +1,8 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
+
+.ams-figure {
+  /* Add styles here */
+}
diff --git a/packages/css/src/components/index.scss b/packages/css/src/components/index.scss
index f8417eaa30..851d9f4288 100644
--- a/packages/css/src/components/index.scss
+++ b/packages/css/src/components/index.scss
@@ -4,6 +4,7 @@
  */
 
 /* Append here */
+@use "./figure/figure";
 @use "file-list/file-list";
 @use "action-group/action-group";
 @use "breakout/breakout";
diff --git a/packages/react/src/Figure/Figure.test.tsx b/packages/react/src/Figure/Figure.test.tsx
new file mode 100644
index 0000000000..af3bac9cba
--- /dev/null
+++ b/packages/react/src/Figure/Figure.test.tsx
@@ -0,0 +1,41 @@
+import { render, screen } from '@testing-library/react'
+import { createRef } from 'react'
+import { Figure } from './Figure'
+import '@testing-library/jest-dom'
+
+describe('Figure', () => {
+  it('renders', () => {
+    render(<Figure />)
+
+    const component = screen.getByRole('figure')
+
+    expect(component).toBeInTheDocument()
+    expect(component).toBeVisible()
+  })
+
+  it('renders a design system BEM class name', () => {
+    render(<Figure />)
+
+    const component = screen.getByRole('figure')
+
+    expect(component).toHaveClass('ams-figure')
+  })
+
+  it('renders an additional class name', () => {
+    render(<Figure className="extra" />)
+
+    const component = screen.getByRole('figure')
+
+    expect(component).toHaveClass('ams-figure extra')
+  })
+
+  it('supports ForwardRef in React', () => {
+    const ref = createRef<HTMLElement>()
+
+    render(<Figure ref={ref} />)
+
+    const component = screen.getByRole('figure')
+
+    expect(ref.current).toBe(component)
+  })
+})
diff --git a/packages/react/src/Figure/Figure.tsx b/packages/react/src/Figure/Figure.tsx
new file mode 100644
index 0000000000..8384ef1edb
--- /dev/null
+++ b/packages/react/src/Figure/Figure.tsx
@@ -0,0 +1,20 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
+
+import clsx from 'clsx'
+import { forwardRef } from 'react'
+import type { ForwardedRef, HTMLAttributes, PropsWithChildren } from 'react'
+
+export type FigureProps = PropsWithChildren<HTMLAttributes<HTMLElement>>
+
+export const Figure = forwardRef(
+  ({ children, className, ...restProps }: FigureProps, ref: ForwardedRef<HTMLElement>) => (
+    <figure {...restProps} ref={ref} className={clsx('ams-figure', className)}>
+      {children}
+    </figure>
+  ),
+)
+
+Figure.displayName = 'Figure'
diff --git a/packages/react/src/Figure/README.md b/packages/react/src/Figure/README.md
new file mode 100644
index 0000000000..90d22b1942
--- /dev/null
+++ b/packages/react/src/Figure/README.md
@@ -0,0 +1,5 @@
+<!-- @license CC0-1.0 -->
+
+# React Figure component
+
+[Figure documentation](../../../css/src/components/figure/README.md)
diff --git a/packages/react/src/Figure/index.ts b/packages/react/src/Figure/index.ts
new file mode 100644
index 0000000000..c6b99f171e
--- /dev/null
+++ b/packages/react/src/Figure/index.ts
@@ -0,0 +1,2 @@
+export { Figure } from './Figure'
+export type { FigureProps } from './Figure'
diff --git a/packages/react/src/index.ts b/packages/react/src/index.ts
index 5bb39cae01..52524af978 100644
--- a/packages/react/src/index.ts
+++ b/packages/react/src/index.ts
@@ -4,6 +4,7 @@
  */
 
 /* Append here */
+export * from './Figure'
 export * from './FileList'
 export * from './ActionGroup'
 export * from './Breakout'
diff --git a/proprietary/tokens/src/components/ams/figure.tokens.json b/proprietary/tokens/src/components/ams/figure.tokens.json
new file mode 100644
index 0000000000..20b683e9be
--- /dev/null
+++ b/proprietary/tokens/src/components/ams/figure.tokens.json
@@ -0,0 +1,5 @@
+{
+  "ams": {
+    "figure": {}
+  }
+}
diff --git a/storybook/src/components/Figure/Figure.docs.mdx b/storybook/src/components/Figure/Figure.docs.mdx
new file mode 100644
index 0000000000..8b5a4d6608
--- /dev/null
+++ b/storybook/src/components/Figure/Figure.docs.mdx
@@ -0,0 +1,13 @@
+{/* @license CC0-1.0 */}
+
+import { Controls, Markdown, Meta, Primary } from "@storybook/blocks";
+import * as FigureStories from "./Figure.stories.tsx";
+import README from "../../../../packages/css/src/components/figure/README.md?raw";
+
+<Meta of={FigureStories} />
+
+<Markdown>{README}</Markdown>
+
+<Primary />
+
+<Controls />
diff --git a/storybook/src/components/Figure/Figure.stories.tsx b/storybook/src/components/Figure/Figure.stories.tsx
new file mode 100644
index 0000000000..a63ee1d5ea
--- /dev/null
+++ b/storybook/src/components/Figure/Figure.stories.tsx
@@ -0,0 +1,21 @@
+/**
+ * @license EUPL-1.2+
+ * Copyright Gemeente Amsterdam
+ */
+
+import { Figure } from '@amsterdam/design-system-react/src'
+import { Meta, StoryObj } from '@storybook/react'
+
+const meta = {
+  title: 'Components/Media/Figure',
+  component: Figure,
+  args: {
+    children: 'Nieuw component',
+  },
+} satisfies Meta<typeof Figure>
+
+export default meta
+
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {}