frontendr's profile picture. Tweets mostly about #HTML, #CSS, #Javascript and other web based technologies.

Frontendɾ

@frontendr

Tweets mostly about #HTML, #CSS, #Javascript and other web based technologies.

Frontendɾ 已转帖

corner-shape: squircle; available in chrome for now used it recently on my site, no more clip-path or svg needed to achieve it

Ibelick's tweet image. corner-shape: squircle;

available in chrome for now
used it recently on my site, no more clip-path or svg needed to achieve it

Frontendɾ 已转帖

little details 👨‍🍳 tiny css transition-delay on :hover filters noise and captures intent .text { transition: grid-template-columns 0.2s var(--ease); } button:hover .text { grid-template-columns: 1fr; transition-delay: 0.1s; }


Frontendɾ 已转帖

accordion transitions w/ css ::details-content, <details> + <summary> 🧑‍🍳 details:has(~ [open]) { --y: -1; } [open] ~ details { --y: 1; } details { translate: 0 calc(var(--y) * 1rem); } [open]::details-content { height: fit-content; }

Accordion interaction ✨ Built with @motiondotdev and inspired by @nitishkmrk



Frontendɾ 已转帖

Using the blur trick for optical alignment


Frontendɾ 已转帖

The new CSS heading selector is so good! This will make it much easier to style headings all at once.

souporserious's tweet image. The new CSS heading selector is so good! This will make it much easier to style headings all at once.

Frontendɾ 已转帖

You know how position: sticky always fails for weird reasons that are a pain in the 🍑 to fix? I finally had enough, peeked at the spec, asked AI some questions, and mostly figured things out—and wrote about it here. Link below 👇

AdamRackis's tweet image. You know how position: sticky always fails for weird reasons that are a pain in the 🍑 to fix?

I finally had enough, peeked at the spec, asked AI some questions, and mostly figured things out—and wrote about it here.

Link below 👇

Frontendɾ 已转帖

Vite 7.2 is out! ⚡️ 🗃️ `build.license` option 🔌 proxy + HTTP2 support 💜 and more features and fixes Don't forget to check the complete changelog github.com/vitejs/vite/bl…


Frontendɾ 已转帖

Yes. You can do responsive inline css vars in Tailwind. [--color:red] sm:[--color:blue]


Frontendɾ 已转帖

oxfmt (the oxc-based formatter) is getting very close to ready! - 2-3x faster than Biome - 45x faster than Prettier - Better prettier conformance than Biome means switching won’t cause huge diffs - More flexible line wrapping than Prettier We have tested oxfmt against several…


Frontendɾ 已转帖

Well played: guthib.com


Frontendɾ 已转帖

@cursor_ai is now in @raycast start agents, track progress, and finish in Cursor – all without leaving the keyboard

Launch and manage @cursor_ai agents with @raycast 🚀 Tips to start: 🎹 Set a hotkey like ⌘ + ⌃ + C for the Launch Agent command 🖼️ Add screenshots of errors or bug reports 🎛️ Take over anytime with the Open in Cursor action Next time you spot a bug, start an agent first!

thomaspaulmann's tweet image. Launch and manage @cursor_ai agents with @raycast 🚀

Tips to start:
🎹 Set a hotkey like ⌘ + ⌃ + C for the Launch Agent command
🖼️ Add screenshots of errors or bug reports
🎛️ Take over anytime with the Open in Cursor action

Next time you spot a bug, start an agent first!
thomaspaulmann's tweet image. Launch and manage @cursor_ai agents with @raycast 🚀

Tips to start:
🎹 Set a hotkey like ⌘ + ⌃ + C for the Launch Agent command
🖼️ Add screenshots of errors or bug reports
🎛️ Take over anytime with the Open in Cursor action

Next time you spot a bug, start an agent first!
thomaspaulmann's tweet image. Launch and manage @cursor_ai agents with @raycast 🚀

Tips to start:
🎹 Set a hotkey like ⌘ + ⌃ + C for the Launch Agent command
🖼️ Add screenshots of errors or bug reports
🎛️ Take over anytime with the Open in Cursor action

Next time you spot a bug, start an agent first!


Frontendɾ 已转帖

⚙️ New CSS Generator! Save this link for the future. A tool to easily convert any SVG shape into a CSS one in no time. Powered by the new shape() function! 🤩 css-generators.com/svg-to-css/ Single-element, responsive, and no more ViewBox headaches.

ChallengesCss's tweet image. ⚙️ New CSS Generator!

Save this link for the future. A tool to easily convert any SVG shape into a CSS one in no time. Powered by the new shape() function! 🤩

css-generators.com/svg-to-css/

Single-element, responsive, and no more ViewBox headaches.

Frontendɾ 已转帖

I STILL get so many folks misunderstanding the difference between: Pick, Omit Exclude, Extract They should be called: PickFromObject, OmitFromObject ExcludeFromUnion, ExtractFromUnion Here's a breakdown:


Frontendɾ 已转帖

tired of seeing fugly `<details>` try this one nerdy.dev/nice-details


Frontendɾ 已转帖

Another shape made easy using the new shape() function. css-tip.com/heart/ I think I just found my new favorite CSS feature. 😍

ChallengesCss's tweet image. Another shape made easy using the new shape() function.

css-tip.com/heart/

I think I just found my new favorite CSS feature. 😍
ChallengesCss's tweet image. Another shape made easy using the new shape() function.

css-tip.com/heart/

I think I just found my new favorite CSS feature. 😍

Another shape with rounded corners using shape()! This time it's an arrow-like box. A single-element responsive implementation easy to adjust using CSS variables. css-tip.com/arrow-like-box/ A follow up to a post by @chriscoyier

ChallengesCss's tweet image. Another shape with rounded corners using shape()!

This time it&apos;s an arrow-like box. A single-element responsive implementation easy to adjust using CSS variables.

css-tip.com/arrow-like-box/

A follow up to a post by @chriscoyier
ChallengesCss's tweet image. Another shape with rounded corners using shape()!

This time it&apos;s an arrow-like box. A single-element responsive implementation easy to adjust using CSS variables.

css-tip.com/arrow-like-box/

A follow up to a post by @chriscoyier


Frontendɾ 已转帖

don't forget `touch-action: manipulation` for buttons on mobile double taps shouldn't zoom


Frontendɾ 已转帖

I'm a @DrizzleORM fan and user, but I'm also an SQL-first dev. Drizzle's migrations are nice, but I prefer migrations to be first-class, rather than an artifact of code-first schema management. If you haven't tried Goose, highly recommend: github.com/pressly/goose


Frontendɾ 已转帖

Found out a nice way to have @tailwindcss IntelliSense anywhere in the code.

RaviCoding's tweet image. Found out a nice way to have @tailwindcss IntelliSense anywhere in the code.

Frontendɾ 已转帖

Writing my TypeScript .cursor/rules. Writing it not only to include my recommendations, but also to tell the AI things about TypeScript that may not be uppermost in its training data. What should I include?


Frontendɾ 已转帖

✍️ New Article: First Look at The Modern attr() I explored the new attr() capabilities and shared my thoughts about it. Happy reading! ishadeed.com/article/modern…

shadeed9's tweet image. ✍️ New Article: First Look at The Modern attr()

I explored the new attr() capabilities and shared my thoughts about it. Happy reading!

ishadeed.com/article/modern…

Loading...

Something went wrong.


Something went wrong.