---
title: "Recipe book animated icon"
description: "Recipe book animated icon (Food & Drink). The cookbook opens to a recipe. Light: the front cover swings open on the spine (it foreshortens toward the spine and its spoon emblem turns away), the recipe's lines write on across the page one after another, then the cover swings shut with a thump, bounces once, and the bookmark ribbon swings from the jolt. Strong: the cover is flung open past its stop and wobbles, the lines write on and hold longer, and the cover slams shut with two bounces while the ribbon swings back and forth. The book block never moves."
canonical: https://generativeicons.com/icons/recipe-book/
---

# Recipe book animated icon

The cookbook opens to a recipe. Light: the front cover swings open on the spine (it foreshortens toward the spine and its spoon emblem turns away), the recipe's lines write on across the page one after another, then the cover swings shut with a thump, bounces once, and the bookmark ribbon swings from the jolt. Strong: the cover is flung open past its stop and wobbles, the lines write on and hold longer, and the cover slams shut with two bounces while the ribbon swings back and forth. The book block never moves.

- Id: `recipe-book`
- Category: Food & Drink
- Search terms: cookbook, cook book, cookery book, recipes, ingredients, meal plan, meal ideas, how to cook, cooking guide, cooking instructions
- 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/recipe-book.lottie (dotLottie, 5871 bytes, sha256 481f75102ce38307f3510baba8905a8afceb4d94f9b1326d1ffc2db78963dfa4)
- License: MIT

## Install

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

## React

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

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