Oleg's Avatar

Oleg

@oleg.id

Founder @webstudio.is , NoCode, CSS, TypeScript,React, Ex eng @tesla, @webflow

206
Followers
18
Following
12
Posts
27.08.2023
Joined
Posts Following

Latest posts by Oleg @oleg.id

Video thumbnail

There are few ideas to integrate Engramma into various tools. Now you can use Engramma on your website. The new engramma package packs the whole app in a Custom Element that you can drop into a dialog and use to edit design tokens extracted from CSS variables directly on the page.

26.01.2026 07:49 ๐Ÿ‘ 13 ๐Ÿ” 4 ๐Ÿ’ฌ 1 ๐Ÿ“Œ 0
Video thumbnail

Today weโ€™re finally unveiling Inception - a creative AI tool that lets you experiment with design ideas backed by production-grade code.

Where should we take this tool next? Letโ€™s discuss it on Product Hunt:

producthunt.com/products/web...

08.10.2025 07:56 ๐Ÿ‘ 1 ๐Ÿ” 3 ๐Ÿ’ฌ 1 ๐Ÿ“Œ 1
Preview
una.im | Follow-the-leader pattern with CSS anchor positioning Learn how to create a dynamically re-anchored pointer element.

I've been using a "follow-the-leader" pattern with CSS anchor positioning lately so I decided to write about it!

You set up a "follower" element and dynamically update the anchor on an event/state. Surprisingly simple and effective.

Read more with demos!:

๐Ÿ‘€โžก๏ธ una.im/follow-the-a...

11.09.2025 18:14 ๐Ÿ‘ 107 ๐Ÿ” 22 ๐Ÿ’ฌ 2 ๐Ÿ“Œ 1

Super nice!

28.08.2025 22:05 ๐Ÿ‘ 1 ๐Ÿ” 0 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

Surprise! We've been sneakily backing up your published sites forever... just forgot the "Restore" button. Now, if you royally screw up your build, rewind to the last good version with one click.

11.07.2025 18:00 ๐Ÿ‘ 7 ๐Ÿ” 3 ๐Ÿ’ฌ 1 ๐Ÿ“Œ 0
Post image

Moving away from static interfaces in an AI-driven world means we need to rethink how we approach design in the coming years.

webstudio.is/blog/moving-...

07.07.2025 12:07 ๐Ÿ‘ 2 ๐Ÿ” 1 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Post image

Inception: a creative, code-first, AI-native design tool

webstudio.is/blog/incepti...

04.07.2025 07:44 ๐Ÿ‘ 5 ๐Ÿ” 2 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 1
Post image

Breaking news: the PAGE NOT FOUND page can now be found!

By default, Webstudio didnโ€™t include 404 pages - you had to add them yourself. Now thatโ€™s changed: theyโ€™re there by default when you create a new project, and, as before, you can style the page however you like.

02.07.2025 08:27 ๐Ÿ‘ 6 ๐Ÿ” 2 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 1
Post image

We just added HTML+Tailwind paste ๐Ÿš€

Paste HTML + Tailwind from any site into Webstudio in one click. Use AI to generate sections or choose from thousands of Tailwind templates.

But there is more to it: webstudio.is/blog/making-...

27.06.2025 11:25 ๐Ÿ‘ 8 ๐Ÿ” 3 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 1
Webstudio Inception - where ideas become real
Webstudio Inception - where ideas become real YouTube video by Webstudio

Introducing Webstudio Inception - the AI-native way to design and build websites.

Invites: webstudio.is/inception

We believe we unlocked something incredibleโ€”go from a single prompt to a unique, beautiful, creative website in minutes. Production-ready code.

www.youtube.com/watch?v=Uf2l...

03.06.2025 12:09 ๐Ÿ‘ 8 ๐Ÿ” 2 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Post image Post image Post image

Prompt: Build a hero section for a company is called iRobot - it makes humanoid robots that help you with farming e.g. harvest veggies from the garden etc

play.tailwindcss.com/EGWkhlEpen?l...

play.tailwindcss.com/HiYvSeAW58?l...

play.tailwindcss.com/I74EDMa90r?l...

18.05.2025 19:34 ๐Ÿ‘ 2 ๐Ÿ” 0 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Post image Post image Post image

Prompt: Create a hero section for a luxury real estate brand that sells expensive homes. Show some objects, prices, locations.

play.tailwindcss.com/gh1SZEH8ip?l...

play.tailwindcss.com/8tfyNfTtMA?l...

play.tailwindcss.com/tcdqKoDMU0?l...

18.05.2025 19:33 ๐Ÿ‘ 2 ๐Ÿ” 0 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Post image Post image Post image

Prompt: Create a hero section for a incredible Coffe shop. Tell about location, opening hours, menu, price range, etc. reviews about how incredible it is.

play.tailwindcss.com/R9bxkes97L?l...

play.tailwindcss.com/hrPssTcyPT?l...

play.tailwindcss.com/dzlUUjx0SU?l...

18.05.2025 19:32 ๐Ÿ‘ 2 ๐Ÿ” 0 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Post image Post image Post image

- Create a hero section for a web developer Ivan Starkov
- Section must contain at least 3 heroic events in his life.
- Section must contain people reviews about how great he is

play.tailwindcss.com/e4L8vbtcAH?l...

play.tailwindcss.com/hUHHNU4cQ1?l...

play.tailwindcss.com/ucGRc3KWD7?l...

18.05.2025 19:31 ๐Ÿ‘ 3 ๐Ÿ” 0 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0

1. All of these were generated from a single, simple promptโ€”written in a language anyone could write.
2. No template was part of the pipeline; this is 100% generative AI.
3. No manual changes, no second prompts, no adjustments whatsoever.

I will be posting more examples to this thread.

๐Ÿงต

18.05.2025 19:31 ๐Ÿ‘ 3 ๐Ÿ” 0 ๐Ÿ’ฌ 4 ๐Ÿ“Œ 0

Team @webstudio.is has been researching Generative Web Design for a while, and this week, we had seven breakthroughs. I canโ€™t disclose the details of each one, but I can share the results.

This is just our prototypeโ€”we still have much to do, but:

18.05.2025 19:31 ๐Ÿ‘ 3 ๐Ÿ” 2 ๐Ÿ’ฌ 2 ๐Ÿ“Œ 0

Truly unbelievable shit show

11.04.2025 19:10 ๐Ÿ‘ 4 ๐Ÿ” 0 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

#CSS only carousels arrive in Chrome 135

โคท nerdy.dev/css-carousel...

20.03.2025 16:40 ๐Ÿ‘ 223 ๐Ÿ” 42 ๐Ÿ’ฌ 13 ๐Ÿ“Œ 6
Deploy Webstudio to Hetzner with Coolify
Deploy Webstudio to Hetzner with Coolify In this tutorial, you will learn how to export your Webstudio Project and use Coolify to deploy it to Hetzner. Coolify is a PaaS that makes it easy to deploy and manage applications on your own server, giving you control over your infrastructure without the complexity. You can self-host Coolify or use their Cloud. See the documentation for more info: https://docs.webstudio.is/university/self-hosting/hetzner-coolify Coolify: https://coolify.io Hetzner: https://www.hetzner.com Build unlimited sites with Webstudio for FREE ๐Ÿ‘‰ https://wstd.us/future-web

No hosting lock-in ๐Ÿ”“ with this setup: Webstudio, Hetzner, Coolify ๐Ÿ”ฅ

Webstudio ๐Ÿ‘‰ Full site export
Hetzner ๐Ÿ‘‰ Cost-effective servers
Coolify ๐Ÿ‘‰ Deployment management

Watch the tutorial ๐Ÿ‘‡

26.02.2025 15:21 ๐Ÿ‘ 9 ๐Ÿ” 2 ๐Ÿ’ฌ 1 ๐Ÿ“Œ 1
Deploy Your Webstudio site to Digital Ocean with Coolify
Deploy Your Webstudio site to Digital Ocean with Coolify In this tutorial, you will learn how to export your Webstudio Project and use Coolify to deploy it to Digital Ocean. Coolify is a PaaS that makes it easy to deploy and manage applications on your own server, giving you control over your infrastructure without the complexity. You can self-host Coolify or use their Cloud. See the documentation for more info: https://docs.webstudio.is/university/self-hosting/digital-ocean-coolify Coolify: https://coolify.io Digital Ocean: https://www.digitalocean.com Build unlimited sites with Webstudio for FREE ๐Ÿ‘‰ https://wstd.us/future-web

Hereโ€™s another self-hosting tutorial โ€” this time with @coolify.io and @digitalocean.com ๐Ÿ™‚

27.02.2025 07:02 ๐Ÿ‘ 5 ๐Ÿ” 2 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

Want to reuse an email ๐Ÿ“ง, phone number, or CMS connection data throughout your site??

Now you can with Global Data Variables!

๐ŸŒŽ Define reusable data globally
๐Ÿ“ฆ Access the variables anywhereโ€ฆ including inside Slots!
๐Ÿ‘Œ Maintain consistency
๐Ÿซฐ Easier CMS setup!

Demos below ๐Ÿ˜‰

28.02.2025 22:30 ๐Ÿ‘ 12 ๐Ÿ” 4 ๐Ÿ’ฌ 3 ๐Ÿ“Œ 1
Video thumbnail

Webstudio now has Docker support for sites!

Export your dynamic site, and deploy it just about anywhere.

Get total control over your hosting, cost, and compliance.

See comments for a tutorial on using Flightcontrol to deploy your site to AWS.

29.01.2025 14:00 ๐Ÿ‘ 14 ๐Ÿ” 4 ๐Ÿ’ฌ 1 ๐Ÿ“Œ 1
Post image

4,000 community members in Discord.

Couldnโ€™t imagine Webstudio without you all โค๏ธ

27.01.2025 13:15 ๐Ÿ‘ 4 ๐Ÿ” 1 ๐Ÿ’ฌ 1 ๐Ÿ“Œ 0
Video thumbnail

Google is screwing your SEO performance? It's all in your ๐—ต๐—ฒ๐—ฎ๐—ฑ.

Meet Head Slot component โ€” the visual way to customize the <head> per page.

๐Ÿ› ๏ธ Set canonical URLs to manage duplicate content for search engines

๐Ÿ› ๏ธ Set alternate URLs for multilingual/regional versions

23.01.2025 07:00 ๐Ÿ‘ 9 ๐Ÿ” 2 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

Made in Webstudio without writing code

โ€œOther platforms are stuck in 2015โ€โ€ฆ

08.01.2025 15:00 ๐Ÿ‘ 6 ๐Ÿ” 1 ๐Ÿ’ฌ 1 ๐Ÿ“Œ 1

Study reveals Webflow sites have 256% more classes than Webstudio

More classes correlate with harder maintainability and slower websites.

Here are the details and the underlying reason for the difference.

wstd.us/tokens-classes

09.01.2025 07:00 ๐Ÿ‘ 9 ๐Ÿ” 1 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

YouTube component is here!

โ†”๏ธ Responsive by default
๐Ÿ’ค Fast with lazy loading
๐ŸŽ›๏ธ UI inputs for all the settings
โ–ถ๏ธ Customizable play icon and loading icon
๐Ÿ‘ป โ€œPrivacy Enhancedโ€ Mode enabled by default

10.01.2025 07:00 ๐Ÿ‘ 8 ๐Ÿ” 1 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

New feature: code folding!

ห… Useful for:

หƒ โ†”๏ธ API responses (JSON)
หƒ ๐Ÿ› ๏ธ Custom code like JavaScript

14.01.2025 08:52 ๐Ÿ‘ 8 ๐Ÿ” 1 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

New in the Marketplace: RSS Feed

๐ŸŽ›๏ธ Fully customizable
๐Ÿ“ฒ Let users subscribe to your content

15.01.2025 07:00 ๐Ÿ‘ 3 ๐Ÿ” 1 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0
Video thumbnail

We made a platform-wide change that reduced INP, a Core Web Vital.

Our site went from 409 ms to 137 ms on mobile.๐Ÿ‘‡

16.01.2025 09:36 ๐Ÿ‘ 7 ๐Ÿ” 2 ๐Ÿ’ฌ 0 ๐Ÿ“Œ 0