Lottie or Rive

Animated Icons for React

React is the most popular UI library for web and React Native apps. Unicorn Icons works seamlessly with lottie-react for Lottie JSON playback, or @rive-app/react-canvas for GPU-accelerated Rive animations with built-in state machines for hover and click interactions. Both libraries are lightweight, tree-shakeable, and fully TypeScript-typed.

Quick start

1

Install lottie-react

npm install lottie-react
2

Add the animation

import Lottie from "lottie-react";
import animationData from "./your_icon.json";

export default function MyIcon() {
  return <Lottie animationData={animationData} loop={true} style={{ width: 64, height: 64 }} />;
}

Browse by category

Animated icons across 22 categories, all available in Lottie or Rive format.

Other platforms