---
title: "Background run animated icon"
description: "Background run animated icon (AI · Agent operations). The task is sent to the background and keeps running there. Light: the front pane steps aside down-left, overshoots a little and settles, and a beat later the progress knob in the back pane runs the length of its track and stops at the end. Strong: the front pane is nudged back first, then pushed further aside and settles in two beats; the knob runs faster and pops as it reaches the end. The back pane's edges stay cut exactly where the front pane covers them. The reset slides the panes back opaque and fades the knob back to its start, as in v1."
canonical: https://generativeicons.com/icons/background-run/
---

# Background run animated icon

The task is sent to the background and keeps running there. Light: the front pane steps aside down-left, overshoots a little and settles, and a beat later the progress knob in the back pane runs the length of its track and stops at the end. Strong: the front pane is nudged back first, then pushed further aside and settles in two beats; the knob runs faster and pops as it reaches the end. The back pane's edges stay cut exactly where the front pane covers them. The reset slides the panes back opaque and fades the knob back to its start, as in v1.

- Id: `background-run`
- Category: AI · Agent operations
- Search terms: async task, async job, non-blocking, detached, daemon, worker, keep running, long running, multitask, multitasking
- Two states: prepared to result, played forward and back
- 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/background-run.lottie (dotLottie, 6811 bytes, sha256 928010a4b34add02cf797a0e4cb37529c32d8f5d9522e8eeefd5e677ed2206f5)
- License: MIT

## Install

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

## React

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

export function BackgroundRunIcon() {
  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/background-run.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/background-run/ · https://generativeicons.com/api/icons/background-run