Kotlinwind CSS

Overview

Kotlinwind CSS is a Kotlin library that enhances your experience with kotlinx.html by providing a more Kotlin-centric approach to styling HTML. Inspired by Tailwind CSS, this library allows you to apply CSS styles directly within your HTML-building code, utilizing Kotlin's type-safe, declarative syntax through a Kotlin DSL (Domain-Specific Language).

Features

• Type-Safe CSS: Write CSS directly in Kotlin using a type-safe API.
• Seamless Integration: Designed to work smoothly with kotlinx.html.
• Declarative Syntax: Benefit from Kotlin's expressive DSL to manage styles inline, reducing the need for external stylesheets.
• Inspired by Tailwind CSS: Leverage a similar utility-first approach for styling, now available in Kotlin.

Code Preview

Kotlinwind CSS Code	Resulting HTML

Motivation

Kotlinwind CSS is built for developers who prefer a Kotlin-native way of styling HTML. By leveraging Kotlin's type-safe, declarative DSL and drawing inspiration from the utility-first approach of Tailwind CSS, this library eliminates the need for traditional CSS files and provides a more cohesive development experience within Kotlin projects.

Getting Started

To start using Kotlinwind CSS in your project, add the following dependency to your build.gradle.kts file:

implementation("io.github.allangomes:kotlinwind-css:{VERSION}")

Replace {VERSION} with the latest version available on Maven Central.

Documentation

For detailed usage instructions and examples, visit the Wiki.

Limitations

Currently, Kotlinwind CSS supports only inline styles. Future versions will introduce support for external stylesheets and CSS classes.

Roadmap

• 0.0.2 - 0.0.9

  • Grid Layout
  • Table Styling
  • SVG Styling
  • CSS Transforms

• 0.1.0 - 0.1.9

  • Class-based Styling
  • @media Queries Support

• Future Plans

  • Kotlin Multiplatform Support
    • Jetpack Compose Integration (returning a Modifier)
  • Interactivity Support (JS/TS Framework Integration)

Note

Interactivity is not a priority at this stage, as starting with a JS/TS framework may be more beneficial for projects requiring dynamic behavior.