Kolor Picker - An Advanced Color Picker for Jetpack Compose

A powerful and versatile color picker library for Jetpack Compose, offering multiple ways to select colors, including a classic HSL panel, an image-based dropper tool, and a ready-to-use dialog.

kolor-picker provides a suite of composables to handle all your color selection needs. It features a standard KolorPicker with hue, saturation, and lightness controls, an ImageKolorPicker to extract colors directly from a bitmap, and a pre-built KolorPickerDialog for quick and easy integration. The library is built with a robust, hoistable state management system (KolorPickerState) that makes it easy to control and observe color changes.

Features

Classic HSL Color Picker (KolorPicker):
- A draggable saturation/lightness panel.
- A horizontal slider for hue selection.
- An optional horizontal slider for alpha/transparency.
- A live preview of the selected color with its HEX and ARGB codes.
Image Dropper Tool (ImageKolorPicker):
- Pick a color directly from an ImageBitmap by tapping or dragging.
- A draggable handle indicates the exact pixel being sampled.
- The UI automatically adapts to the image's aspect ratio.
Ready-to-Use Dialog (KolorPickerDialog):
- A pre-built, animated AlertDialog that wraps the KolorPicker or ImageKolorPicker.
- Comes with "Done", "Close" and optional "Reset" buttons.
- Handles its own visibility state and provides callbacks for color selection.
Robust State Management:
- Uses rememberKolorPickerState() to create a hoistable, saveable state (KolorPickerState).
- KolorPickerState holds the selectedColor and can be updated programmatically.
Utility Features:
- Optional copy/paste buttons to interact with the system clipboard.

Installation

Groovy (build.gradle):

dependencies {
    implementation 'com.github.bashpsk.emptylibs:kolor-picker:<latest-version>'
}

Kotlin DSL (build.gradle):

dependencies {
    implementation("com.github.bashpsk.emptylibs:kolor-picker:<latest-version>")
}

Kotlin DSL with Version Catalogs:

[versions]
empty-libs = "<latest-version>"

[libraries]
emptylibs-kolor-picker = { group = "com.github.bashpsk.emptylibs", name = "kolor-picker", version.ref = "empty-libs" }

dependencies {
    implementation(libs.emptylibs.kolor.picker)
}

Usage

1. Normal ColorPicker

Use this for a standard HSL-based color selection UI.

val colorPickerState = rememberKolorPickerState(initialColor = MaterialTheme.colorScheme.primary)

KolorPicker(
    state = colorState,
    enableAlphaPanel = true, // Enable transparency slider
    enableCopyButtons = true // Show copy/paste buttons
)

Box(
    modifier = Modifier
        .size(64.dp)
        .background(colorPickerState.selectedColor)
)

2. ImageColorPicker

Use this to let users pick a color directly from an image.

val colorPickerState = rememberKolorPickerState()

ImageKolorPicker(
    imageBitmap = sourceBitmap,
    state = colorPickerState
)

Box(
    modifier = Modifier
        .size(64.dp)
        .background(colorPickerState.selectedColor)
)

3. ColorPickerDialog

val dialogVisibleState = remember { MutableTransitionState(false) }
val colorPickerState = rememberKolorPickerState()

// Button to open the dialog
Button(onClick = { dialogVisibleState.targetState = true }) {
    Text("Choose Color")
}

// The dialog itself
KolorPickerDialog(
    dialogVisibleState = dialogVisibleState,
    state = colorPickerState,
    onSelectedColor = { newColor ->
        // Handle the final selected color
    }
)

// Image Color Picker Dialog
KolorPickerDialog(
    dialogVisibleState = dialogVisibleState,
    state = colorPickerState,
    imageBitmap = baseImage,
    onSelectedColor = { newColor ->
        // Handle the final selected color
    }
)