# How to make an element smaller or bigger with CSS

> Learn how to make an HTML element bigger or smaller with the CSS zoom property, using values below 1 to shrink and above 1 to grow, plus a Firefox fallback.

Author: [Flavio Copes](https://flaviocopes.com/about/) | Published: 2021-07-23 | Topics: [CSS](https://flaviocopes.com/tags/css/) | Canonical: https://flaviocopes.com/css-zoom/

Sometimes you might have the need, especially when designing a page, to scale an item so it looks smaller, or bigger.

You can use the CSS `zoom` property to scale any HTML element.

Use a value < 1 to make an element smaller. For example, half the size with `0.5`:

```css
div {
  zoom: 0.5;
}
```

or use a value > 1 to make the element bigger, like in this case to scale it 2x:

```css
div {
  zoom: 2;
}
```

> Note that it does not work in Firefox, you could use `-moz-transform: scale(NUMBER);` instead (and if you go that route, you can use `transform: scale(NUMBER);` on all browsers, too).