styled-ppx is the ppx that brings styled components to ReScript. Build on top of emotion, it allows you to style apps safe, quickly, performant and as you always done it. Allows you to create React Components with type-safe style definitions that don't rely on a different language (DSL) than CSS

npm install @davesnx/styled-ppx

Add "@davesnx/styled-ppx/ppx" under bsconfig "ppx-flags":

{
  "bs-dependencies": [
    "@rescript/react",
+   "@davesnx/styled-ppx/css",
+   "@davesnx/styled-ppx/emotion"
  ],
+ "ppx-flags": ["@davesnx/styled-ppx/ppx"]
}

Read more about getting started

For the entire documentation, visit styled-ppx.vercel.app

We provide editor extensions that brings syntax highlight, for now. (It will include IntelliSense or other CSS-related features).

Install the VSCode Extension

Install the vim plugin

If you are interested on another editor, please fill an issue.

We would love your help improving styled-ppx! Please see our contributing and community guidelines, they'll help you get set up locally and explain the whole process: CONTRIBUTING.md.

This project is licensed under the Simplified BSD License (BSD 2-Clause License).