Layouts.dev (@layoutsdev) header
Layouts.dev (@layoutsdev) profile picture

Design with code. Break free from boilerplate.

🌎
Joined February 2024
Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)Photo by Layouts.dev (@layoutsdev)
I've been having so much fun with @layoutsdev, added a @hiunicornstudio iFrame to it play around. Really awesome what you can achieve with so little Remix in the 🧵
2
1
132
Layouts.dev retweeted
Replying to @hiunicornstudio
@hiunicornstudio x layoutsdotdev
1
2
127
Zero lag. Instant previews. The way building should feel.
109
Use the /video component in layoutsdotdev to describe the video you need using natural language and we’ll find the closest match—instantly. No need to hunt through stock sites.
101
The easiest way to jumpstart your next idea? Remix existing projects on layoutsdotdev—spend less time setting up and more time creating.
1
2
2
138
Layouts.dev retweeted
✨ Tailwind CSS v4.0 is here! Huge performance improvements, radically simplified setup experience, CSS-first configuration, modernized P3 color palette, container queries, 3D transforms, expanded gradient APIs, @​starting-style support… …and tons, tons more.
296
1,040
228
6,557
507,468
Layouts.dev retweeted
when i want to sweat the details - I love using @layoutsdev
1
2
2
93
Accelerate your design process with a library of pre-built HTML, layouts(dot)dev and @shadcn components available in our editor. We're continuously building out our lib. Which new components would you find most beneficial in your workflow?
91
Ever wish your Layouts files were more composable? With the new `/import ` component, now they are.🔥 Reuse pre-made snippets, UIs, tokens, classes, or entire screens across projects in seconds. Stop copy-pasting. Start composing. Type: `/import [insert your project ID]`
1
1
1
185
layouts.dev / this tool is *underrated*, you've got to give it a try
1
1
6
427
Merry Christmas🎄 Introducing Tokens & Custom Classes 💥 Define and reuse styles for a faster, more consistent workflow. 🧵
1
1
1
139
//Custom Classes If you need fine-grained control, create your own classes with the `/class` component. How: - Define your class: For example, blue = #0000ff; - Use it with a period prefix: When applying it in your code, it must start with . (e.g., .blue { color: #0000ff; })
1
1
52
We built these features in direct response to your feedback. Tokens and custom classes will help: - Streamline your design system. - Keep visuals consistent across multiple components and projects. - Improve collaboration. - Boost productivity. Happy building 🫡
1
33
In Layouts, create your own custom mesh gradients by using the `/bg-mesh` component and then specify visual parameters like seed, length, opacity, and base color using `@` attributes.
1
77