Contraster

The Contraster is an Android application that empowers users to create custom color schemes using the HSL (Hue, Saturation, Lightness) color model. With an intuitive user interface built using Kotlin and Jetpack Compose, users can experiment with different color combinations for both background and foreground elements. The app provides real-time previews on a pre-built layout, enabling users to assess the readability and aesthetics of their chosen color scheme.

Features

• HSL Color Generation: Users can create unique colors by adjusting the Hue, Saturation, and Lightness values using interactive sliders.
• Real-time Previews: The app instantly displays how the chosen color scheme looks on a predefined layout, helping users visualize the end result.
• Background and Foreground Customization: Users can separately define colors for the background and foreground elements, ensuring optimal contrast and readability.
• MVVM Architecture: The app follows the Model-View-ViewModel (MVVM) architecture, promoting separation of concerns and maintainability.
• Jetpack Compose: Built using Jetpack Compose, the app benefits from a declarative UI toolkit that simplifies UI development and encourages a reactive programming approach.
• Compose Navigation: Jetpack Compose Navigation is used to manage navigation between different screens and sections of the app.
• Dependency Injection: Koin is utilized for dependency injection, facilitating modular and testable code.

Dependencies

The app relies on the following libraries and tools:

• Jetpack Compose: For building the UI using a modern and reactive approach.
• Compose Navigation: For managing navigation between different screens.
• Koin: For dependency injection, promoting modularity and testability.
• Android Architecture Components: For implementing MVVM architecture and reactive components.
• Flow: For managing and observing asynchronous data streams.

Usage

1. Launch the app on your Android device or emulator.

2. Use the interactive sliders to adjust the Hue, Saturation, and Lightness values.

3. Observe the real-time previews of the chosen color scheme on the pre-built layout.

4. Define separate HSL colors for the background and foreground elements.

5. Experiment with different color combinations until you achieve your desired look.

6. Test your pallete on a pre-built layout to check how your colors affect the reading capablities of an article.