Furiganable

Furiganable is a simple and flexible library for adding furigana (phonetic readings) to text components. It’s designed to be easy to use.

This library is heavily inspired by the android-compose-furigana library.

Features

• Compatible with Compose Multiplatform (Android, iOS)
• Compatible with both Material 2 and Material 3 libraries
• Easily add furigana by using a simple predefined format, such as [漢字[かんじ]].
• Supports Localization

Variations

This library consists of three modules: compose-core, compose-m2, and compose-m3. Including just one of them is sufficient. Both compose-m2 and compose-m3 already include compose-core.

Module	Recommended	Description	Use Case
compose-core	-	A minimal core module with no dependency on Material libraries. Requires passing additional parameters to components.	Ideal for projects that avoid using Material libraries.
compose-m2	✅	Designed for projects using the Material 2 library.	Use if your project relies on Material 2.
compose-m3	✅	Designed for projects using the Material 3 library.	Use if your project relies on Material 3.

Images

Material 2

Android (> 28)	Android (<= 28)	iOS 18

Material 3

Android (> 28)	Android (<= 28)	iOS 18

API Reference

API Reference🐢

Limitations

To force isFallbackLineSpacing = false for furigana text, the library swaps Jetpack Compose’s Text composable for an AndroidTextView in certain paths. As a consequence, some Text-related parameters are currently ignored.

Unsupported at the moment

• TextStyle: textMotion
• Text composable args: onTextLayout

If you depend on these APIs, the library may not yet meet your requirements. PRs welcome.

Known Issues

When using lineHeightStyle with any trim option other than LineHeightStyle.Trim.None, text with furigana becomes misaligned compared to text without furigana.

Usage

Add dependency on this library

Version Catalog

If you're using Version Catalog, add the following to your libs.versions.toml file:

[versions]
#...
furiganable = "$version"

[libraries]
#...
furiganable = { module = "com.turtlekazu.furiganable:compose-m3", version.ref = "furiganable" }

or

[libraries]
#...
furiganable = { module = "com.turtlekazu.furiganable:compose-m3", version = "$version" }

then

repositories {
    mavenCentral()
}

dependencies {
    // ...
    implementation(libs.furiganable)
}

Gradle

If you're using Gradle instead, add the following to your build.gradle file:

Kotlin DSL

dependencies {
    implementation("com.turtlekazu.furiganable:compose-m3:$version")
}

Groovy DSL

dependencies {
    implementation 'com.turtlekazu.furiganable:compose-m3:$version'
}

Add component to your composable function

The format to add furigana is like, [漢字[かんじ]]. To recognize the start and end positions of kanji, outer brackets are required.

Before

@Composable
fun SampleComponent() {
    // ...

    // I want to add furigana to this Text component
    Text(
        text = "これは試験用の文字列です。",
    )
}

After

@Composable
fun SampleComponent() {
    // ...

    // Replace Text component with TextWithReading component
    TextWithReading(
        formattedText = "これは[試験用[しけんよう]]の[文字列[もじれつ]]です。",
    )
}

You can use localized string for text with furigana like below.

In strings.xml(ja),

<string name="sample_text">これは[試験用[しけんよう]]の[文字列[もじれつ]]です。</string>

In your composable function,

@Composable
fun SampleComponent() {
    // ...

    // You can use localized string with furigana
    TextWithReading(
        formattedText = stringResource(R.string.sample_text),
    )
}

Customization

You can customize the appearance of the furigana text by passing additional parameters to the TextWithReadingCore, TextWithReading(m2), or TextWithReading(m3) components:

• furiganaEnabled:
  Whether to enable furigana.
  If false, a normal text component is used.

• furiganaGap:
  Space between the main text and the furigana.
  Defaults to style.fontSize * 0.03f if unspecified.

• furiganaFontSize:
  Font size for the furigana text.
  Defaults to style.fontSize * 0.45f if unspecified.

• furiganaLineHeight:
  Line height for the furigana text.
  Defaults to furiganaFontSize if unspecified.

• furiganaLetterSpacing:
  Letter spacing for the furigana text.
  Defaults to -style.fontSize * 0.03f if unspecified.

Examples

See demo app code for more examples.

License

Copyright 2025 turtlekazu

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.