What is Nostr?
Eric A. Meyer /
npub1dge…yw0u
2024-04-05 18:12:03

Eric A. Meyer on Nostr: A #CSS thing I did today: ``` --inset: transparent 0.67rem, black 0.5rem; mask: ...

A #CSS thing I did today:
```
--inset: transparent 0.67rem, black 0.5rem;
mask:
linear-gradient(45deg, var(--inset)),
linear-gradient(135deg, var(--inset)),
linear-gradient(225deg, var(--inset)),
linear-gradient(315deg, var(--inset))
;
mask-composite: intersect;
```
*(Note: does not play particularly well with borders, outlines, or drop shadows.)*

The reason I did this instead of `clip-path` is to angle-snip the corners off elements of any size or aspect ratio. A small thing, but I like it.
Author Public Key
npub1dgewglf93wmf9u26ppwmmjmqa5uphv5jrtmtfkc3q7n754z3p8xqyayw0u