Sizing

All icons are 24×24 px by default. The size can be adjusted using the size prop, CSS, or Tailwind CSS.

Adjusting size using the size prop

You can control the icon size by passing a value to the size prop.

import { Star } from '@zappicon/react' function App() { return <Star size={48} /> }

Resizing with CSS

Icons can be resized using the Tailwind CSS utility classes w-{size} and h-{size} or size-{size}.

import { Star } from '@zappicon/react' function App() { return <Star style={{ width: '32px', height: '32px' }} /> }

Resizing with Tailwind CSS

You can resize icons using Tailwind CSS utility classes.

import { Star } from '@zappicon/react' function App() { return <Star className="h-8 w-8" /> }