为字体上色

🌐 Color the font

使用 CSS 对 Lucide 图标字体进行样式设置非常简单。你可以在 CSS 中使用 color 属性更改图标的颜色。这使你可以轻松地自定义图标的外观以匹配你的设计。

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

更改图标颜色

🌐 Changing Icon Color

要更改图标的颜色，只需将 color 属性应用到包含图标的元素上。例如，如果你想将图标的颜色更改为红色，可以使用以下 CSS：

🌐 To change the color of the icons, simply apply the color property to the element that contains the icon. For example, if you want to change the color of an icon to red, you can use the following CSS:

.icon-house {
  color: red;
}

这将把类为 icon-house 的图标颜色更改为红色。你可以使用任何有效的 CSS 颜色值，例如十六进制代码、RGB 或命名颜色。

🌐 This will change the color of the icon with the class icon-house to red. You can use any valid CSS color value, such as hex codes, RGB, or named colors.

从父元素继承颜色

🌐 Inheriting Color from Parent Elements

默认情况下，图标将继承其父元素的颜色。这意味着如果你在父元素上设置了颜色，所有子图标将自动采用该颜色，除非你为图标单独指定颜色进行覆盖。和 HTML 中的文本元素一样，图标字体将使用 color 属性来确定其颜色，从而方便在整个项目中进行样式设置和保持一致性。

🌐 By default, the icons will inherit the color from their parent elements. This means that if you set a color on a parent element, all child icons will automatically take on that color unless you override it with a specific color for the icon. The same as text elements in HTML, the icon font will use the color property to determine its color, allowing for easy styling and consistency across your project.