---
title: "Server animated icon"
description: "Server animated icon (Infrastructure & devices). The server handles a request: its activity lights flash in turn. Light: the top unit's light flares and settles, and the bottom unit's light answers a beat later. Strong: both lights flash twice, top then bottom, the second flash bigger. The lights never go out (in Solid they are windows that must stay open), and the rack units never move."
canonical: https://generativeicons.com/icons/server/
---

# Server animated icon

The server handles a request: its activity lights flash in turn. Light: the top unit's light flares and settles, and the bottom unit's light answers a beat later. Strong: both lights flash twice, top then bottom, the second flash bigger. The lights never go out (in Solid they are windows that must stay open), and the rack units never move.

- Id: `server`
- Category: Infrastructure & devices
- Search terms: server rack, rack, hosting, web hosting, backend, data center, data centre, datacenter, web server, vps, host, on-premise, mainframe, rack mount
- 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/server.lottie (dotLottie, 4383 bytes, sha256 ca27d059a1c0acfd95c12df8acf7d18a4e66a0552a5bcf0971c0a6e209cf61c4)
- License: MIT

## Install

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

## React

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

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