Show HN: Compiled, buildtime atomic CSS in JavaScript and all your favorite APIs

This page summarizes the projects mentioned and recommended in the original post on news.ycombinator.com

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • WorkOS - The modern identity platform for B2B SaaS
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • linaria

    Zero-runtime CSS in JS library

    The differentiating feature of Atlassian’s @compiled package is not the “build time atomic css” - it’s that you can distribute components that use @compiled on NPM without requiring your consumer to futz with Webpack include paths for e.g. CSS files. Do I have that right? @madou is the extraction shipping yet? The docs have a few places that say “coming in 2021” - what’s the status?

    If all you’re interested in is build-time CSS in JS, also called Zero-runtime CSS in JS, you might also be interested in:

    - Linaria (https://github.com/callstack/linaria) I use on my personal site. I ran into trouble/bugs trying to integrate it with Notion’s build process.

    - Treat requires that you write the JS that computes your styles in esperare xxx.treat.js files which is annoying from my point of view - I want single file components. (https://seek-oss.github.io/treat/)

    - No idea about this one, but it’s more recent https://github.com/CraigCav/css-zero

  • stylesheet

    Discontinued Dynamic CSS for user interfaces (by iddan)

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  • cxs

    fast af css-in-js in 0.7kb

    Works with any framework or with none, apparently, although I've only used it with Preact. Supports themes. Everything I need and nothing I don't.

    [0] https://github.com/cxs-css/cxs

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts