---
title: "Chat search animated icon"
description: "Chat search animated icon (Chat & messaging). The search finds the message. Light: the lens sweeps 3 units left beneath the message, swings back and stops dead on its result, then zooms in on it (the magnifier grows from the hand toward the message) and settles. Strong: the lens winds up to the right, sweeps 4 units with its glass trailing, snaps back onto the result and zooms further, settling in two beats. The bubble and its text never move."
canonical: https://generativeicons.com/icons/chat-search/
---

# Chat search animated icon

The search finds the message. Light: the lens sweeps 3 units left beneath the message, swings back and stops dead on its result, then zooms in on it (the magnifier grows from the hand toward the message) and settles. Strong: the lens winds up to the right, sweeps 4 units with its glass trailing, snaps back onto the result and zooms further, settling in two beats. The bubble and its text never move.

- Id: `chat-search`
- Category: Chat & messaging
- Search terms: search messages, search conversation, search in chat, find message, find in chat, look up message, message lookup
- 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/chat-search.lottie (dotLottie, 3980 bytes, sha256 37208680da654c2ed64386b958c412cd7fc0b956824ac5b8359d1990d4dfd7ea)
- License: MIT

## Install

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

## React

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

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