diff --git a/packages/ui/src/components/Button/Button.css.ts b/packages/ui/src/components/Button/Button.css.ts
index 13f35504b4..89ad939f7f 100644
--- a/packages/ui/src/components/Button/Button.css.ts
+++ b/packages/ui/src/components/Button/Button.css.ts
@@ -197,6 +197,10 @@ const SIZE_STYLES = {
     textAlign: 'center',
     borderRadius: tokens.radius.md,
   },
+  icon: {
+    borderRadius: tokens.radius.xxs,
+    padding: tokens.space.xxxs,
+  },
 } as const
 
 export const buttonSizeStyles = {
@@ -204,6 +208,7 @@ export const buttonSizeStyles = {
     small: style(SIZE_STYLES.small),
     medium: style(SIZE_STYLES.medium),
     large: style(SIZE_STYLES.large),
+    icon: style(SIZE_STYLES.icon),
   },
   lg: {
     small: style({
@@ -221,9 +226,16 @@ export const buttonSizeStyles = {
         [minWidth.lg]: SIZE_STYLES.large,
       },
     }),
+    icon: style({
+      '@media': {
+        [minWidth.lg]: SIZE_STYLES.icon,
+      },
+    }),
   },
 }
 
+export const iconButtonStyles = style({ aspectRatio: '1', height: 'auto' })
+
 export const childrenWrapper = style({
   display: 'flex',
   alignItems: 'center',
diff --git a/packages/ui/src/components/Button/Button.helpers.ts b/packages/ui/src/components/Button/Button.helpers.ts
index 56190ab13e..2d894afc0a 100644
--- a/packages/ui/src/components/Button/Button.helpers.ts
+++ b/packages/ui/src/components/Button/Button.helpers.ts
@@ -1,6 +1,6 @@
 import { buttonSizeStyles } from './Button.css'
 
-type ButtonSizeVariant = 'small' | 'medium' | 'large'
+type ButtonSizeVariant = 'small' | 'medium' | 'large' | 'icon'
 type ButtonLevels = 'base' | 'lg'
 
 export type ButtonSize = ButtonSizeVariant | Record<ButtonLevels, ButtonSizeVariant>
diff --git a/packages/ui/src/components/Button/Button.stories.tsx b/packages/ui/src/components/Button/Button.stories.tsx
index 312d3c7ad4..1b7f75342b 100644
--- a/packages/ui/src/components/Button/Button.stories.tsx
+++ b/packages/ui/src/components/Button/Button.stories.tsx
@@ -1,8 +1,10 @@
 import type { Meta, StoryFn } from '@storybook/react'
-import { CheckIcon, yStack } from 'ui'
+import { type ComponentProps } from 'react'
+import { CheckIcon, CrossIcon, yStack } from 'ui'
 import { Button } from './Button'
+import { IconButton } from './IconButton'
 
-type Controls = typeof Button
+type Controls = ComponentProps<typeof Button>
 
 const meta: Meta<Controls> = {
   title: 'Button',
@@ -109,3 +111,11 @@ export const WithIcon = {
     Icon: <CheckIcon size="18px" />,
   },
 }
+
+export const IconButtonDefault = {
+  render: (args: Controls) => <IconButton variant={args.variant}>{args.Icon}</IconButton>,
+  args: {
+    Icon: <CrossIcon size="18px" />,
+    variant: 'primary',
+  },
+}
diff --git a/packages/ui/src/components/Button/IconButton.tsx b/packages/ui/src/components/Button/IconButton.tsx
new file mode 100644
index 0000000000..9fdf2cb211
--- /dev/null
+++ b/packages/ui/src/components/Button/IconButton.tsx
@@ -0,0 +1,21 @@
+import clsx from 'clsx'
+import { type ComponentProps, forwardRef } from 'react'
+import { Button } from './Button'
+import { iconButtonStyles } from './Button.css'
+
+type ButtonProps = ComponentProps<typeof Button<'button'>>
+
+export const IconButton = forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, children, ...props }, forwardedRef) => (
+    <Button
+      className={clsx(iconButtonStyles, className)}
+      variant="ghost"
+      size="icon"
+      Icon={children}
+      {...props}
+      ref={forwardedRef}
+    />
+  ),
+)
+
+IconButton.displayName = 'IconButton'
diff --git a/packages/ui/src/index.ts b/packages/ui/src/index.ts
index 179499914a..430e97093d 100644
--- a/packages/ui/src/index.ts
+++ b/packages/ui/src/index.ts
@@ -5,6 +5,8 @@ export { HedvigLogo } from './components/HedvigLogo/HedvigLogo'
 export { HedvigSymbol } from './components/HedvigSymbol/HedvigSymbol'
 export { Space } from './components/Space'
 export { Button, type ButtonProps } from './components/Button/Button'
+export { IconButton } from './components/Button/IconButton'
+
 export { InputBase } from './components/InputBase'
 export type { InputBaseProps } from './components/InputBase'
 export { Heading } from './components/Heading/Heading'