Stylefy

screenshot of Stylefy

Clojure(Script) library for styling user interface components.

Overview

The stylefy project is a tool that allows developers to define CSS styles as Clojure data and easily attach them to HTML elements without the need for writing selectors. This approach makes it easier to write and maintain style code. Originally created for front-end development, stylefy can now be used on both web browsers and servers. It utilizes Garden for CSS conversions and offers features such as defining styles as Clojure data, supporting pseudo-classes and pseudo-elements, scoping, and vendor prefixes. It also provides caching options, a small and simple core API, and support for automatic style reloading.

Features

  • Define styles as Clojure data with support for all important CSS features.
  • Ability to use 3rd party CSS code along with stylefy.
  • Manual mode for stylizing 3rd party components and handling complex CSS selectors.
  • Scoping: ability to define styles that are applied only when the current element is in a specific scope.
  • Support for vendor prefixes both locally and globally.
  • CSS caching on the frontend using local storage (optional).
  • Small and simple core API that is easy to set up.
  • Fast and asynchronous CSS generation on the frontend with an option for synchronous generation.
  • Automatic style reloading with shadow-cljs or Figwheel.

Summary

Stylefy is a tool that allows developers to define CSS styles as Clojure data and easily attach them to HTML elements without writing selectors. It supports various CSS features, offers scoping options, and provides caching and fast CSS generation on the frontend. With its small and simple core API, it is easy to set up and can be used with different UI libraries/frameworks. Stylefy's automatic style reloading feature is helpful for development, and it is compatible with popular browsers.

ui-kit
UI Kits & Components

A UI kit provides developers with a set of reusable components that can be easily integrated into a website or application. These components are pre-designed with consistent styling and functionality, allowing developers to save time and effort in the design and development process. UI kits can be either custom-built or third-party, and often include components for buttons, forms, typography, icons, and more.