bahulneel

How recognising design semantics transformed my colour system

Note: All colour names and values in this article are fictional substitutes to protect brand identity. The actual implementation uses a vibrant fruit-inspired palette.

Why does defining a brand colour require 121 CSS definitions?

Modern design systems promise consistency and maintainability, yet we find ourselves managing sprawling colour scales (50, 100, 200, through 950 for every hue). We duplicate these scales for dark mode. We add opacity modifiers for states. What started as 11 carefully chosen brand colours becomes hundreds of CSS custom properties, most of which never get used.

During my Tailwind 4 migration, I stumbled into a different approach. Not through grand architectural planning, but through bidirectional exploration (working top-down until it broke, then bottom-up until it broke, then switching again). What emerged was a revelation: design has its own semantics, separate from UI semantics. Understanding this distinct

bahulneel

thanks everyone for coming it's so great to see all the old friends and all the new friends and especially all the very cool things everyone's doing I want to doubly thank Alex for scheduling a talk before mine that was so full of amazing Graphics that no one would possibly be able to Bear anymore and I could I could leave them out of my talk so this is a design and practice and the objective here is to demystify designs so much I think somewhat I think I've given a few talks in the past they're about a lot of the ideas in design but left the concrete practice of it sort of underspecified and it's led to maybe a certain uh imagined magicness to to design that I wanted to spell I think design is something that you can learn to do I think it's something that has concrete activities you know practices or things that we do oh by the way if you're playing word definition Bingo you're going to wish you had like more than one card today uh and uh and to try to talk you through some of the I what I think are kind of 

bahulneel

Design

Data model

---
title: Vetting Preferences Entity Relationships
---
erDiagram
    Property 1--0+ PropertyTenant : prefers
    PropertyTenant {

bahulneel

Keybase proof

I hereby claim:

• I am bahulneel on github.
• I am bahulneel (https://keybase.io/bahulneel) on keybase.
• I have a public key ASBoanAStRexJFUVJy0Fn5nlg8N-16hKzUT8YN-MZk3f1wo

To claim this, I am signing this object:

bahulneel

(def conn (d/create-conn {}))

(def data
  [{:a 1 :b 2}
   {:a 2 :b 3 :c true}])

(d/transact! conn data)

(defn not-join
  [db q vars where]

bahulneel

(->> eid
     (d/q '[:find ?an ?v ?cn
            :in $ ?e
            :where
            [?e ?a ?v]
            [?a :db/ident ?an]
            [?a :db/cardinality ?c]
            [?c :db/ident ?cn]]
          db)
     (reduce (fn [m [k v c]]

bahulneel

(defn wrap-save-content [handler content-type]
  (fn [request]
    (if (= content-type (get-in request [:headers "Content-Type"]))
      (let [temp-file (clojure.java.io/file ...)]
        (copy (:body request) temp-file)
        (handler (assoc request :body temp-file)))
      (handler request))))

bahulneel

<?php

function removeVars($sql)
{
	$sql = preg_replace('/(\b)\d+(\b)/', '\1?\2', $sql);
	$sql = str_replace('?, ', '', $sql);
	$sql = str_replace("\t", ' ', $sql);
	return $sql;
}