Add support for more CSS properties in compatibility matrix

[Ouranos27]

Context

The engine currently tracks 250+ CSS properties across 13 email clients, synced from caniemail.com. But there are gaps — some commonly-used properties aren't tracked or have incomplete client coverage.

How to contribute

This is a great first contribution! The CSS support data lives in:

• `src/data/css-support.ts` — the main compatibility matrix
• `scripts/sync-caniemail.ts` — auto-sync from caniemail.com

To add a missing property:

1. Check caniemail.com for the property's support status
2. If it's in caniemail.com but missing from the engine, the sync script may need updating
3. If it's NOT in caniemail.com, add it manually with a source citation (MDN, email client docs, personal testing)
4. Add a test case in the relevant test file

Properties we know are missing or incomplete:

• `aspect-ratio` — increasingly used, limited client data
• `clamp()` — used in fluid typography
• `:has()` selector — new CSS, unknown email client support
• `container queries` — emerging CSS feature
• `accent-color` — form styling
• `text-wrap: balance` — typography

Getting started

bun install
bun test                    # Run all 580 tests
bun run sync:caniemail      # Refresh data from caniemail.com
bun run check:freshness     # See which data sources are stale

[Amitdwivedi22]

Hi,
I’d like to work on this issue matrix #4. I have experience with JavaScript/TypeScript and would love to contribute by adding missing CSS properties and improving the sync script.

Could you please assign this issue to me?

thank you,
Amit

[Ouranos27]

Hey, welcome! Assigned.
Thanks for wanting to contribute.

The CSS support data lives in src/rules/css-support.ts. It's auto-generated from caniemail.com via bun run sync:caniemail (the script is scripts/sync-caniemail.ts). The CONTRIBUTING.md has a step-by-step under "How to Add a New CSS Property Rule" that covers the full flow.

Short version: check caniemail.com for the property, add the support entry to css-support.ts, add a fix snippet in the relevant file under src/fix-snippets/, write a test in src/tests/engine.test.ts, and run bun test.

Small PRs with 6-8 properties are easier to review than one big batch. If you want a good starting point, any property that caniemail covers but isn't in the matrix yet is fair game.

Questions welcome here or in Discussions.