---
title: "Unlink animated icon"
description: "Unlink animated icon (Actions). The link breaks. Light: the two halves of the chain slide together along their axis until they hook into each other like a link, then snap apart past their place with a jolt, rebound and settle; the break marks burst out on both sides of the gap as they part. Strong: they hook together and tug once against each other, then tear apart harder, overshoot farther and settle in two beats, and the break marks burst out wider. The halves are rigid; they only slide along their shared axis."
canonical: https://generativeicons.com/icons/unlink/
---

# Unlink animated icon

The link breaks. Light: the two halves of the chain slide together along their axis until they hook into each other like a link, then snap apart past their place with a jolt, rebound and settle; the break marks burst out on both sides of the gap as they part. Strong: they hook together and tug once against each other, then tear apart harder, overshoot farther and settle in two beats, and the break marks burst out wider. The halves are rigid; they only slide along their shared axis.

- Id: `unlink`
- Category: Actions
- Search terms: remove link, break link, broken link, broken chain, chain, detach, unchain, dead link, unlink account, disconnect account
- One action, back to rest
- Styles: outline, solid, duotone; outline weights 1.5, 2, 2.5 (any from 1 to 3); motion light or strong
- File: https://generativeicons.com/assets/unlink.lottie (dotLottie, 4605 bytes, sha256 37a723f77785b49d0d0e58155fcec41e9d4e401dd7e9e978f9dfa1fd15823e4b)
- License: MIT

## Install

```sh
npm install @lottiefiles/generative-icons-runtime
npx generative-icons init
npx generative-icons add unlink
```

## React

```tsx
// npm install @lottiefiles/generative-icons-react
'use client';
import { AnimatedIcon } from '@lottiefiles/generative-icons-react';
import icon, { src } from './generative-icons/unlink.mjs';

export function UnlinkIcon() {
  return <AnimatedIcon icon={icon} src={src} size={32}
    color="#ffffff" variant="outline" weight={2}
    motion="light" theme="dark" />;
}
```

## JavaScript

```js
import { createIcon } from '@lottiefiles/generative-icons-runtime';
import icon, { src } from './generative-icons/unlink.mjs';

const handle = await createIcon(canvas, {
  icon, src,
  color: '#ffffff', style: 'outline', weight: 2,
  motion: 'light', theme: 'dark'
});
button.addEventListener('click', () => handle.play());
// On removal: handle.destroy();
```

More: https://generativeicons.com/icons/unlink/ · https://generativeicons.com/api/icons/unlink
