diff --git a/package.json b/package.json
index 230f1b6..d76cf17 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
     "codegen": "yarn workspaces foreach run codegen"
   },
   "workspaces": [
+    "packages/fast-css-prop",
     "packages/truss",
     "packages/template-tachyons",
     "packages/testing-tachyons",
diff --git a/packages/app-tachyons-fela-prop/package.json b/packages/app-tachyons-fela-prop/package.json
index c9b794f..5a96365 100644
--- a/packages/app-tachyons-fela-prop/package.json
+++ b/packages/app-tachyons-fela-prop/package.json
@@ -9,8 +9,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@homebound/fast-css-prop": "workspace:*",
     "@homebound/truss-testing-tachyons": "workspace:*",
-    "fela": "^12.2.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
diff --git a/packages/app-tachyons-fela-prop/src/App.test.tsx b/packages/app-tachyons-fela-prop/src/App.test.tsx
index 691aff5..38c3838 100644
--- a/packages/app-tachyons-fela-prop/src/App.test.tsx
+++ b/packages/app-tachyons-fela-prop/src/App.test.tsx
@@ -17,7 +17,7 @@ describe("App", () => {
         <div>
           <div>
             <h1
-              class="black top1"
+              class="a b"
             >
               Vite1
             </h1>
diff --git a/packages/app-tachyons-fela-prop/vite.config.ts b/packages/app-tachyons-fela-prop/vite.config.ts
index b4f40ed..d4f9bac 100644
--- a/packages/app-tachyons-fela-prop/vite.config.ts
+++ b/packages/app-tachyons-fela-prop/vite.config.ts
@@ -3,5 +3,5 @@ import react from "@vitejs/plugin-react-swc";
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react({ jsxImportSource: "." })],
+  plugins: [react({ jsxImportSource: "@homebound/fast-css-prop" })],
 });
diff --git a/packages/app-tachyons-fela-prop/src/jsx-dev-runtime.js b/packages/fast-css-prop/jsx-dev-runtime.js
similarity index 75%
rename from packages/app-tachyons-fela-prop/src/jsx-dev-runtime.js
rename to packages/fast-css-prop/jsx-dev-runtime.js
index 2d97de3..9876522 100644
--- a/packages/app-tachyons-fela-prop/src/jsx-dev-runtime.js
+++ b/packages/fast-css-prop/jsx-dev-runtime.js
@@ -1,5 +1,5 @@
 import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
-import { maybeExpandCssProp } from "./cssProp.ts";
+import { maybeExpandCssProp } from "./build/cssProp.js";
 
 export function jsxDEV(type, props, ...children) {
   return _jsxDEV(type, maybeExpandCssProp(props), ...children);
diff --git a/packages/app-tachyons-fela-prop/src/jsx-runtime.js b/packages/fast-css-prop/jsx-runtime.js
similarity index 73%
rename from packages/app-tachyons-fela-prop/src/jsx-runtime.js
rename to packages/fast-css-prop/jsx-runtime.js
index b8dff32..a10ebff 100644
--- a/packages/app-tachyons-fela-prop/src/jsx-runtime.js
+++ b/packages/fast-css-prop/jsx-runtime.js
@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { maybeExpandCssProp } from "./cssProp.ts";
+import { maybeExpandCssProp } from "./build/cssProp.js";
 
 export function jsx(type, props, ...children) {
   return _jsx(type, maybeExpandCssProp(props), ...children);
diff --git a/packages/fast-css-prop/package.json b/packages/fast-css-prop/package.json
new file mode 100644
index 0000000..c562f0f
--- /dev/null
+++ b/packages/fast-css-prop/package.json
@@ -0,0 +1,22 @@
+{
+  "name": "@homebound/fast-css-prop",
+  "version": "1.136.0",
+  "main": "build/index.js",
+  "bin": "cli.js",
+  "scripts": {
+    "test": "jest"
+  },
+  "exports": {
+    ".": "./build/cssProp.js",
+    "./jsx-runtime": "./jsx-runtime.js",
+    "./jsx-dev-runtime": "./jsx-dev-runtime.js"
+  },
+  "license": "ISC",
+  "dependencies": {
+    "fela": "^12.2.1"
+  },
+  "devDependencies": {
+    "@homebound/tsconfig": "^1.0.3",
+    "typescript": "^5.7.3"
+  }
+}
diff --git a/packages/app-tachyons-fela-prop/src/cssProp.ts b/packages/fast-css-prop/src/cssProp.ts
similarity index 73%
rename from packages/app-tachyons-fela-prop/src/cssProp.ts
rename to packages/fast-css-prop/src/cssProp.ts
index 3a592a3..c2b39a0 100644
--- a/packages/app-tachyons-fela-prop/src/cssProp.ts
+++ b/packages/fast-css-prop/src/cssProp.ts
@@ -1,17 +1,23 @@
 import { createRenderer } from "fela";
 import { render } from "fela-dom";
-import { names } from "@homebound/truss-testing-tachyons";
+// import { names } from "@homebound/truss-testing-tachyons";
 
 // Create a renderer
 const renderer = createRenderer();
 // Auto-inject any CSS it creates into the DOM
 render(renderer);
 
-const existingGenerateClassName = renderer.generateClassName.bind(renderer);
-renderer.generateClassName = (property: string, value: string, pseudo: string, media: string, support: string) => {
-  const ref = property + value + pseudo + media + support;
-  return names[ref] ?? existingGenerateClassName(property, value, pseudo, media, support);
-};
+// const existingGenerateClassName = (renderer as any).generateClassName.bind(renderer);
+// (renderer as any).generateClassName = (
+//   property: string,
+//   value: string,
+//   pseudo: string,
+//   media: string,
+//   support: string,
+// ) => {
+//   const ref = property + value + pseudo + media + support;
+//   return names[ref] ?? existingGenerateClassName(property, value, pseudo, media, support);
+// };
 
 /**
  * Wraps React's JSX runtime (i.e. `createElement`) with `css` prop support.
diff --git a/packages/app-tachyons-fela-prop/src/jsx-namespace.d.ts b/packages/fast-css-prop/src/jsx-namespace.d.ts
similarity index 100%
rename from packages/app-tachyons-fela-prop/src/jsx-namespace.d.ts
rename to packages/fast-css-prop/src/jsx-namespace.d.ts
diff --git a/packages/app-tachyons-fela-prop/src/jsx.d.ts b/packages/fast-css-prop/src/jsx.d.ts
similarity index 100%
rename from packages/app-tachyons-fela-prop/src/jsx.d.ts
rename to packages/fast-css-prop/src/jsx.d.ts
diff --git a/packages/fast-css-prop/tsconfig.json b/packages/fast-css-prop/tsconfig.json
new file mode 100644
index 0000000..6e3b09a
--- /dev/null
+++ b/packages/fast-css-prop/tsconfig.json
@@ -0,0 +1,16 @@
+{
+  "extends": "@homebound/tsconfig/tsconfig.json",
+  "compilerOptions": {
+    "module": "commonjs",
+    "target": "es5",
+    "sourceMap": true,
+    "downlevelIteration": true,
+    "baseUrl": ".",
+    "outDir": "build/",
+    "plugins": [
+      { "transform": "typescript-transform-paths" },
+      { "transform": "typescript-transform-paths", "afterDeclarations": true }
+    ]
+  },
+  "include": ["./src"]
+}
diff --git a/packages/testing-tachyons/src/Css.ts b/packages/testing-tachyons/src/Css.ts
index b0a3417..59b20dc 100644
--- a/packages/testing-tachyons/src/Css.ts
+++ b/packages/testing-tachyons/src/Css.ts
@@ -1,8 +1,5 @@
 import { Properties as Properties1 } from "csstype";
 
-/** color#123 -> black. */
-export const names: Record<string, string> = {};
-
 // This file is auto-generated by truss: https://github.com/homebound-team/truss.
 // See your project's `truss-config.ts` to make configuration changes (fonts, increments, etc).
 
@@ -208,7 +205,6 @@ class CssBuilder<T extends Properties> {
   }
   /** Sets `top: "v"`. */
   top(v: number | string) {
-    names[`top${maybeInc(v)}`] = `top${v}`;
     return this.add("top", maybeInc(v));
   }
   /** Sets `top: px`. */
@@ -1066,51 +1062,45 @@ class CssBuilder<T extends Properties> {
   // lineClamp
   /** Sets `overflow: "hidden"; display: "-webkit-box"; WebkitBoxOrient: "vertical"; textOverflow: "ellipsis"; WebkitLineClamp: 1`. */
   get lineClamp1() {
-    return this.add("overflow", "hidden")
-      .add("display", "-webkit-box")
-      .add("WebkitBoxOrient", "vertical")
-      .add("textOverflow", "ellipsis")
-      .add("WebkitLineClamp", 1);
+    return this.add("overflow", "hidden").add("display", "-webkit-box").add("WebkitBoxOrient", "vertical").add(
+      "textOverflow",
+      "ellipsis",
+    ).add("WebkitLineClamp", 1);
   }
   /** Sets `overflow: "hidden"; display: "-webkit-box"; WebkitBoxOrient: "vertical"; textOverflow: "ellipsis"; WebkitLineClamp: 2`. */
   get lineClamp2() {
-    return this.add("overflow", "hidden")
-      .add("display", "-webkit-box")
-      .add("WebkitBoxOrient", "vertical")
-      .add("textOverflow", "ellipsis")
-      .add("WebkitLineClamp", 2);
+    return this.add("overflow", "hidden").add("display", "-webkit-box").add("WebkitBoxOrient", "vertical").add(
+      "textOverflow",
+      "ellipsis",
+    ).add("WebkitLineClamp", 2);
   }
   /** Sets `overflow: "hidden"; display: "-webkit-box"; WebkitBoxOrient: "vertical"; textOverflow: "ellipsis"; WebkitLineClamp: 3`. */
   get lineClamp3() {
-    return this.add("overflow", "hidden")
-      .add("display", "-webkit-box")
-      .add("WebkitBoxOrient", "vertical")
-      .add("textOverflow", "ellipsis")
-      .add("WebkitLineClamp", 3);
+    return this.add("overflow", "hidden").add("display", "-webkit-box").add("WebkitBoxOrient", "vertical").add(
+      "textOverflow",
+      "ellipsis",
+    ).add("WebkitLineClamp", 3);
   }
   /** Sets `overflow: "hidden"; display: "-webkit-box"; WebkitBoxOrient: "vertical"; textOverflow: "ellipsis"; WebkitLineClamp: 4`. */
   get lineClamp4() {
-    return this.add("overflow", "hidden")
-      .add("display", "-webkit-box")
-      .add("WebkitBoxOrient", "vertical")
-      .add("textOverflow", "ellipsis")
-      .add("WebkitLineClamp", 4);
+    return this.add("overflow", "hidden").add("display", "-webkit-box").add("WebkitBoxOrient", "vertical").add(
+      "textOverflow",
+      "ellipsis",
+    ).add("WebkitLineClamp", 4);
   }
   /** Sets `overflow: "hidden"; display: "-webkit-box"; WebkitBoxOrient: "vertical"; textOverflow: "ellipsis"; WebkitLineClamp: 5`. */
   get lineClamp5() {
-    return this.add("overflow", "hidden")
-      .add("display", "-webkit-box")
-      .add("WebkitBoxOrient", "vertical")
-      .add("textOverflow", "ellipsis")
-      .add("WebkitLineClamp", 5);
+    return this.add("overflow", "hidden").add("display", "-webkit-box").add("WebkitBoxOrient", "vertical").add(
+      "textOverflow",
+      "ellipsis",
+    ).add("WebkitLineClamp", 5);
   }
   /** Sets `overflow: "hidden"; display: "-webkit-box"; WebkitBoxOrient: "vertical"; textOverflow: "ellipsis"; WebkitLineClamp: 6`. */
   get lineClamp6() {
-    return this.add("overflow", "hidden")
-      .add("display", "-webkit-box")
-      .add("WebkitBoxOrient", "vertical")
-      .add("textOverflow", "ellipsis")
-      .add("WebkitLineClamp", 6);
+    return this.add("overflow", "hidden").add("display", "-webkit-box").add("WebkitBoxOrient", "vertical").add(
+      "textOverflow",
+      "ellipsis",
+    ).add("WebkitLineClamp", 6);
   }
   /** Sets `WebkitLineClamp: "unset"`. */
   get lineClampNone() {
@@ -1118,11 +1108,10 @@ class CssBuilder<T extends Properties> {
   }
   /** Sets `WebkitLineClamp: value`. */
   lineClamp(value: Properties["WebkitLineClamp"]) {
-    return this.add("WebkitLineClamp", value)
-      .add("overflow", "hidden")
-      .add("display", "-webkit-box")
-      .add("WebkitBoxOrient", "vertical")
-      .add("textOverflow", "ellipsis");
+    return this.add("WebkitLineClamp", value).add("overflow", "hidden").add("display", "-webkit-box").add(
+      "WebkitBoxOrient",
+      "vertical",
+    ).add("textOverflow", "ellipsis");
   }
 
   // objectFit
@@ -1286,7 +1275,6 @@ class CssBuilder<T extends Properties> {
   // skins
   /** Sets `color: "#353535"`. */
   get black() {
-    names["color#353535"] = "black";
     return this.add("color", "#353535");
   }
   /** Sets `color: "#888888"`. */
@@ -1573,45 +1561,45 @@ class CssBuilder<T extends Properties> {
   }
   /** Sets `marginTop: "16px"; marginBottom: "16px"; marginRight: "16px"; marginLeft: "16px"`. */
   get m2() {
-    return this.add("marginTop", "16px")
-      .add("marginBottom", "16px")
-      .add("marginRight", "16px")
-      .add("marginLeft", "16px");
+    return this.add("marginTop", "16px").add("marginBottom", "16px").add("marginRight", "16px").add(
+      "marginLeft",
+      "16px",
+    );
   }
   /** Sets `marginTop: "24px"; marginBottom: "24px"; marginRight: "24px"; marginLeft: "24px"`. */
   get m3() {
-    return this.add("marginTop", "24px")
-      .add("marginBottom", "24px")
-      .add("marginRight", "24px")
-      .add("marginLeft", "24px");
+    return this.add("marginTop", "24px").add("marginBottom", "24px").add("marginRight", "24px").add(
+      "marginLeft",
+      "24px",
+    );
   }
   /** Sets `marginTop: "32px"; marginBottom: "32px"; marginRight: "32px"; marginLeft: "32px"`. */
   get m4() {
-    return this.add("marginTop", "32px")
-      .add("marginBottom", "32px")
-      .add("marginRight", "32px")
-      .add("marginLeft", "32px");
+    return this.add("marginTop", "32px").add("marginBottom", "32px").add("marginRight", "32px").add(
+      "marginLeft",
+      "32px",
+    );
   }
   /** Sets `marginTop: "auto"; marginBottom: "auto"; marginRight: "auto"; marginLeft: "auto"`. */
   get ma() {
-    return this.add("marginTop", "auto")
-      .add("marginBottom", "auto")
-      .add("marginRight", "auto")
-      .add("marginLeft", "auto");
+    return this.add("marginTop", "auto").add("marginBottom", "auto").add("marginRight", "auto").add(
+      "marginLeft",
+      "auto",
+    );
   }
   /** Sets `marginTop: "v"; marginBottom: "v"; marginRight: "v"; marginLeft: "v"`. */
   m(v: number | string) {
-    return this.add("marginTop", maybeInc(v))
-      .add("marginBottom", maybeInc(v))
-      .add("marginRight", maybeInc(v))
-      .add("marginLeft", maybeInc(v));
+    return this.add("marginTop", maybeInc(v)).add("marginBottom", maybeInc(v)).add("marginRight", maybeInc(v)).add(
+      "marginLeft",
+      maybeInc(v),
+    );
   }
   /** Sets `marginTop: px; marginBottom: px; marginRight: px; marginLeft: px`. */
   mPx(px: number) {
-    return this.add("marginTop", `${px}px`)
-      .add("marginBottom", `${px}px`)
-      .add("marginRight", `${px}px`)
-      .add("marginLeft", `${px}px`);
+    return this.add("marginTop", `${px}px`).add("marginBottom", `${px}px`).add("marginRight", `${px}px`).add(
+      "marginLeft",
+      `${px}px`,
+    );
   }
   /** Sets `paddingTop: "0px"`. */
   get pt0() {
@@ -1783,52 +1771,52 @@ class CssBuilder<T extends Properties> {
   }
   /** Sets `paddingTop: "0px"; paddingBottom: "0px"; paddingRight: "0px"; paddingLeft: "0px"`. */
   get p0() {
-    return this.add("paddingTop", "0px")
-      .add("paddingBottom", "0px")
-      .add("paddingRight", "0px")
-      .add("paddingLeft", "0px");
+    return this.add("paddingTop", "0px").add("paddingBottom", "0px").add("paddingRight", "0px").add(
+      "paddingLeft",
+      "0px",
+    );
   }
   /** Sets `paddingTop: "8px"; paddingBottom: "8px"; paddingRight: "8px"; paddingLeft: "8px"`. */
   get p1() {
-    return this.add("paddingTop", "8px")
-      .add("paddingBottom", "8px")
-      .add("paddingRight", "8px")
-      .add("paddingLeft", "8px");
+    return this.add("paddingTop", "8px").add("paddingBottom", "8px").add("paddingRight", "8px").add(
+      "paddingLeft",
+      "8px",
+    );
   }
   /** Sets `paddingTop: "16px"; paddingBottom: "16px"; paddingRight: "16px"; paddingLeft: "16px"`. */
   get p2() {
-    return this.add("paddingTop", "16px")
-      .add("paddingBottom", "16px")
-      .add("paddingRight", "16px")
-      .add("paddingLeft", "16px");
+    return this.add("paddingTop", "16px").add("paddingBottom", "16px").add("paddingRight", "16px").add(
+      "paddingLeft",
+      "16px",
+    );
   }
   /** Sets `paddingTop: "24px"; paddingBottom: "24px"; paddingRight: "24px"; paddingLeft: "24px"`. */
   get p3() {
-    return this.add("paddingTop", "24px")
-      .add("paddingBottom", "24px")
-      .add("paddingRight", "24px")
-      .add("paddingLeft", "24px");
+    return this.add("paddingTop", "24px").add("paddingBottom", "24px").add("paddingRight", "24px").add(
+      "paddingLeft",
+      "24px",
+    );
   }
   /** Sets `paddingTop: "32px"; paddingBottom: "32px"; paddingRight: "32px"; paddingLeft: "32px"`. */
   get p4() {
-    return this.add("paddingTop", "32px")
-      .add("paddingBottom", "32px")
-      .add("paddingRight", "32px")
-      .add("paddingLeft", "32px");
+    return this.add("paddingTop", "32px").add("paddingBottom", "32px").add("paddingRight", "32px").add(
+      "paddingLeft",
+      "32px",
+    );
   }
   /** Sets `paddingTop: "v"; paddingBottom: "v"; paddingRight: "v"; paddingLeft: "v"`. */
   p(v: number | string) {
-    return this.add("paddingTop", maybeInc(v))
-      .add("paddingBottom", maybeInc(v))
-      .add("paddingRight", maybeInc(v))
-      .add("paddingLeft", maybeInc(v));
+    return this.add("paddingTop", maybeInc(v)).add("paddingBottom", maybeInc(v)).add("paddingRight", maybeInc(v)).add(
+      "paddingLeft",
+      maybeInc(v),
+    );
   }
   /** Sets `paddingTop: px; paddingBottom: px; paddingRight: px; paddingLeft: px`. */
   pPx(px: number) {
-    return this.add("paddingTop", `${px}px`)
-      .add("paddingBottom", `${px}px`)
-      .add("paddingRight", `${px}px`)
-      .add("paddingLeft", `${px}px`);
+    return this.add("paddingTop", `${px}px`).add("paddingBottom", `${px}px`).add("paddingRight", `${px}px`).add(
+      "paddingLeft",
+      `${px}px`,
+    );
   }
 
   // textAlign
@@ -2384,12 +2372,10 @@ class CssBuilder<T extends Properties> {
 
 /** Emotion treats the same rules, ordered differently as different classes, but naively they can be the same. */
 function sortObject<T extends object>(obj: T): T {
-  return Object.keys(obj)
-    .sort()
-    .reduce((acc, key) => {
-      acc[key as keyof T] = obj[key as keyof T];
-      return acc;
-    }, {} as any as T) as T;
+  return Object.keys(obj).sort().reduce((acc, key) => {
+    acc[key as keyof T] = obj[key as keyof T];
+    return acc;
+  }, ({} as any) as T) as T;
 }
 
 /** Conditionally adds `important!` to everything. */
diff --git a/tsconfig.json b/tsconfig.json
index 48a7257..8d6d50b 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,5 +1,6 @@
 {
   "references": [
+    { "path": "./packages/fast-css-prop" },
     { "path": "./packages/truss" },
     { "path": "./packages/template-tachyons" },
     { "path": "./packages/testing-tachyons" },
diff --git a/yarn.lock b/yarn.lock
index 2721ec5..8e65978 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -722,6 +722,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@homebound/fast-css-prop@workspace:*, @homebound/fast-css-prop@workspace:packages/fast-css-prop":
+  version: 0.0.0-use.local
+  resolution: "@homebound/fast-css-prop@workspace:packages/fast-css-prop"
+  dependencies:
+    "@homebound/tsconfig": ^1.0.3
+    fela: ^12.2.1
+    typescript: ^5.7.3
+  bin:
+    fast-css-prop: cli.js
+  languageName: unknown
+  linkType: soft
+
 "@homebound/truss-template-tachyons@workspace:packages/template-tachyons":
   version: 0.0.0-use.local
   resolution: "@homebound/truss-template-tachyons@workspace:packages/template-tachyons"
@@ -2736,6 +2748,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "app-tachyons-fela-prop@workspace:packages/app-tachyons-fela-prop"
   dependencies:
+    "@homebound/fast-css-prop": "workspace:*"
     "@homebound/truss-testing-tachyons": "workspace:*"
     "@testing-library/dom": ^10.4.0
     "@testing-library/jest-dom": ^6.6.3
@@ -2744,7 +2757,6 @@ __metadata:
     "@types/react": ^18.0.24
     "@types/react-dom": ^18.0.8
     "@vitejs/plugin-react-swc": ^3.7.2
-    fela: ^12.2.1
     react: ^19.0.0
     react-dom: ^19.0.0
     typescript: ^5.7.3