---
title: "Knowledge graph animated icon"
description: "Knowledge graph animated icon (AI · Knowledge). A new edge grows from the hub to an unlinked node, which snaps into place as it connects. Strong leans the hub toward it first and lets the linked neighbours rebalance afterwards."
canonical: https://generativeicons.com/icons/knowledge-graph/
---

# Knowledge graph animated icon

A new edge grows from the hub to an unlinked node, which snaps into place as it connects. Strong leans the hub toward it first and lets the linked neighbours rebalance afterwards.

- Id: `knowledge-graph`
- Category: AI · Knowledge
- Search terms: ontology, entity graph, semantic network, graph database, graph db, nodes and edges, node graph, linked data, relationships, concept map, network graph, triples
- 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/knowledge-graph.lottie (dotLottie, 11997 bytes, sha256 564bf703f3784e4669cd4f33ddd4987178c5955bc63a2c9cad9bc434147de612)
- License: MIT

## Install

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

## React

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

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