Easy use of Google's Material Symbols via variable fonts: adjustable weight, size, grade, style, and tint through simple Symbol functions for UI icons.
This library is a Compose Multiplatform library that aims to facilitate the use of
the new Google's Material Symbols, as the old compose icons libraries
(material-icons-[extended]) are now deprecated.
This library is built on top of Symbol's variable fonts and therefore allows to customize the weight, style and size of the symbols.
Compose Material Symbols provided several Compose functions to easily displays different styles of Material Symbols. They all take the same parameters:
@Composable
<Filled/Outlined>[Sharp/Rounded]Symbol(
icon: String, // The name of the symbol, available in MaterialSymbols object
weight: FontWeight, // The weight of the symbol,
size: Dp, // The size of the symbol, defaults to 24dp,
grade: Float, // The grade of the symbol, defaults to 0f
tint: Color, // The tint color of the symbol, defaults to the current content color
modifier: Modifier // Additional modifiers
)Example:
@Composable
FilledSymbol(
icon = MaterialSymbols.CLOSE,
weight = FontWeight.Bold,
size = 32.dp,
tint = MaterialTheme.colorScheme.error
)Will display a red bold "close" symbol ( X ), with a size of 32dp
[!TIP] Compose Material Symbols is based on font files (.ttf) that are packed into the library binaries. When working with custom build logic that affects the resulting resources structure, make sure these files are included in your final binary, otherwise they won't show up
kotlin {
sourceSets {
commonMain.dependencies {
implementation("dev.vicart:compose-material-symbols:1.1.0")
}
}
}dependencies {
implementation("dev.vicart:compose-material-symbols:1.1.0")
}This library is a Compose Multiplatform library that aims to facilitate the use of
the new Google's Material Symbols, as the old compose icons libraries
(material-icons-[extended]) are now deprecated.
This library is built on top of Symbol's variable fonts and therefore allows to customize the weight, style and size of the symbols.
Compose Material Symbols provided several Compose functions to easily displays different styles of Material Symbols. They all take the same parameters:
@Composable
<Filled/Outlined>[Sharp/Rounded]Symbol(
icon: String, // The name of the symbol, available in MaterialSymbols object
weight: FontWeight, // The weight of the symbol,
size: Dp, // The size of the symbol, defaults to 24dp,
grade: Float, // The grade of the symbol, defaults to 0f
tint: Color, // The tint color of the symbol, defaults to the current content color
modifier: Modifier // Additional modifiers
)Example:
@Composable
FilledSymbol(
icon = MaterialSymbols.CLOSE,
weight = FontWeight.Bold,
size = 32.dp,
tint = MaterialTheme.colorScheme.error
)Will display a red bold "close" symbol ( X ), with a size of 32dp
[!TIP] Compose Material Symbols is based on font files (.ttf) that are packed into the library binaries. When working with custom build logic that affects the resulting resources structure, make sure these files are included in your final binary, otherwise they won't show up
kotlin {
sourceSets {
commonMain.dependencies {
implementation("dev.vicart:compose-material-symbols:1.1.0")
}
}
}dependencies {
implementation("dev.vicart:compose-material-symbols:1.1.0")
}