Re: [csswg-drafts] [css-properties-values-api] Shorthand for custom property declaration (#7523)

> Two days later, I’m now leaning more towards a different solution: typed statement at-rules for registering simple global variables in `var()` space that always inherit, but possibly don‘t support overwriting, i.e. are constant.
> 
> @color --grue: rgb(0% 80% 80%);
> @length --finger-tip: 8mm;
> @size --vga: 640px 480px;
> @angle --north-west: 45deg;
> @number --phi: calc(1 + sqrt(5/4));
> @url --home: src('/#top');
> @image --ci-logo: url("/img/acme.svg");


@Crissov If you really wanted to list the syntax types and set up a default value for each, maybe this could work?

```css
@properties syntax("<length-percentage>") {
  inherits: true;
  --gap: 1em;
  --padding: 5%;
  --margin: 10px;
}
```

Though I think I prefer the `@property --a, --b, --c { ... }` approach best, with the overrides described in either Nesting to overwrite/extend or Using keyword to re-use definition from Sebastian's post above, which feel most intuitive, despite a little more repetition.

-- 
GitHub Notification of comment by chriskirknielsen
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7523#issuecomment-3644065122 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 11 December 2025 22:30:15 UTC