---
title: "Pointer size animated icon"
description: "Pointer size animated icon (Accessibility & reading). The pointer grows from its default size to a large size and holds, anchored at its tip. Light: it gathers in a touch, swells out toward the size corner, overshoots a little and settles large; the corner flinches out as the pointer arrives and springs back. Strong: a deeper gather, a bigger overshoot with two settling swings, and a harder flinch of the corner. The reverse shrinks it back to the default size."
canonical: https://generativeicons.lottiefiles.com/icons/pointer-size/
---

# Pointer size animated icon

The pointer grows from its default size to a large size and holds, anchored at its tip. Light: it gathers in a touch, swells out toward the size corner, overshoots a little and settles large; the corner flinches out as the pointer arrives and springs back. Strong: a deeper gather, a bigger overshoot with two settling swings, and a harder flinch of the corner. The reverse shrinks it back to the default size.

- Id: `pointer-size`
- Category: Accessibility & reading
- Search terms: cursor size, bigger cursor, large cursor, enlarge cursor, cursor scale, larger pointer, bigger pointer, mouse size, resize cursor
- Two states: default to large, 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.lottiefiles.com/assets/pointer-size.lottie (dotLottie, 11403 bytes, sha256 36c83ac8445f5174695d21ecdf4c57970604e4c1d86e6be5d750e6f55ffd9c7f)
- License: MIT

## Install

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

## React

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

export function PointerSizeIcon() {
  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/pointer-size.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.lottiefiles.com/icons/pointer-size/ · https://generativeicons.lottiefiles.com/api/icons/pointer-size