---
title: Size the Lucide icon font
description: Learn how to customize the color of Lucide icons in your static projects using CSS. This guide covers how to change icon colors with CSS classes and inline styles for web font implementations.
---
# Size the font

Styling the Lucide icon font with CSS is straightforward. You can change the color of the icons using the `font-size` property in your CSS. This allows you to easily customize the appearance of the icons to match your design.

## Changing the size

To change the size of the icons, simply apply the `font-size` property to the element that contains the icon. For example, if you want to change the size of an icon to 24px, you can use the following CSS:

```css
.icon-house {
  font-size: 24px;
}
```

This will change the size of the icon with the class `icon-house` to 24px. You can use any valid CSS size value, such as em, rem, or percentage.