Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

Brooooooooooooo WTF... this browser DevTools feature is mind-blowing. 🤯 Visit any website, open DevTools, click on the 3 dots menu... choose "More tools"... then "CSS Overview", and click "Capture overview". It generates a detailed breakdown of the page's colors, fonts, media queries, unused declarations, and more. Such a simple... show more

Ram Maheshwari

5,861 subscribers

47,093 views • 2 months ago •via X (Twitter)

Science & Technology Education

Anya Rossi• Live Now

Private livecam show

6 Comments

𝗤𝗜𝗡𝗚♔𝗖𝗛𝗔𝗥𝗟𝗘𝗦2 months ago

What on earth?! How long has that feature been sat there unfound? I know there is so much more in devtools I've yet to uncover.

Ram Maheshwari2 months ago

Facts 💯

Diablid ®️1 month ago

🥸

Vishnu Aniyan1 month ago

Didn't know CSS overview existed, honestly. DevTools has so many buried tabs like this, most devs stick to Elements and Console and never dig further

Felipe • video editor1 month ago

i thoght it was a hack tutorial

Anonymous1 month ago

Is there a way to download it so we can give it to claude for copying a websites css

Related Videos

Brooooooooooooooo WTF?? This is sooooo freaking awesome 🤯 I recently found this browser extension that instantly lets you turn almost any website into an editable Figma design in seconds. Perfect for developers, designers, ai coders & anyone who works with Figma :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Brooooooooooooooo WTF?? This is sooooo freaking awesome 🤯 I recently found this browser extension that instantly lets you turn almost any website into an editable Figma design in seconds. Perfect for developers, designers, ai coders & anyone who works with Figma :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

14,204 views • 1 month ago

Brooooooooooooooo WTF?? This is sooooo freaking awesome 🤯 I recently found this browser extension that instantly lets you turn almost any website into an editable Figma design in seconds. Perfect for developers, designers, ai coders & anyone who works with Figma :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Brooooooooooooooo WTF?? This is sooooo freaking awesome 🤯 I recently found this browser extension that instantly lets you turn almost any website into an editable Figma design in seconds. Perfect for developers, designers, ai coders & anyone who works with Figma :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

50,287 views • 2 months ago

Brooooooo... This Chrome extension is sooo perfect for LLMs. 🤯 It lets you instantly convert almost any webpage into clean Markdown, making it easier to use with ChatGPT, Claude, Gemini, and other AI tools. Perfect for AI enthusiasts, developers, designers, researchers, and anyone who works with web content :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Brooooooo... This Chrome extension is sooo perfect for LLMs. 🤯 It lets you instantly convert almost any webpage into clean Markdown, making it easier to use with ChatGPT, Claude, Gemini, and other AI tools. Perfect for AI enthusiasts, developers, designers, researchers, and anyone who works with web content :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

70,474 views • 3 months ago

Holy Sh*t Brooooooooo... This Chrome extension is sooo perfect for LLMs. 🤯 It lets you instantly convert almost any webpage into clean Markdown, making it easier to use with ChatGPT, Claude, Gemini, and other AI tools. Perfect for AI enthusiasts, developers, designers, & anyone who works with web content :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Holy Sh*t Brooooooooo... This Chrome extension is sooo perfect for LLMs. 🤯 It lets you instantly convert almost any webpage into clean Markdown, making it easier to use with ChatGPT, Claude, Gemini, and other AI tools. Perfect for AI enthusiasts, developers, designers, & anyone who works with web content :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

22,292 views • 2 months ago

MiroMiro is live! 🥳 I built a Chrome extension that extracts everything from any website in one click. • Colors and full palettes • Fonts • Images, icons, SVGs • Lottie animations • CSS styles No more opening DevTools. No more saving assets one by one. Just click, see everything, download what you need. Try it free →

MiroMiro is live! 🥳 I built a Chrome extension that extracts everything from any website in one click. • Colors and full palettes • Fonts • Images, icons, SVGs • Lottie animations • CSS styles No more opening DevTools. No more saving assets one by one. Just click, see everything, download what you need. Try it free →

Soraia

2,358,168 views • 10 months ago

Wait WTF? You can find all the subdomains of a website with one simple URL. 🤯 This "CRT" hack lets you list subdomains associated with a primary domain using public certificate data. Just type: . name/v1/search?apex=[domain-name-here] Replace [domain-name-here] with the domain you want to check, and it'll show the matching subdomains. No installation. No complicated setup. Just one URL. Watch the video for a quick demo :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Wait WTF? You can find all the subdomains of a website with one simple URL. 🤯 This "CRT" hack lets you list subdomains associated with a primary domain using public certificate data. Just type: . name/v1/search?apex=[domain-name-here] Replace [domain-name-here] with the domain you want to check, and it'll show the matching subdomains. No installation. No complicated setup. Just one URL. Watch the video for a quick demo :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

123,530 views • 2 months ago

Dude WTF??... You can find all the subdomains of a website with one simple URL. 🤯 This "CRT" hack lets you list subdomains associated with a primary domain using public certificate data. Just type: . name/v1/search?apex=[domain-name-here] Replace [domain-name-here] with the domain you want to check, and it'll show the matching subdomains. No installation... No complicated setup... Just one URL. Watch the video for a quick demo :) Follow me for more amazing AI, Coding & Web Dev insights. 💎

Dude WTF??... You can find all the subdomains of a website with one simple URL. 🤯 This "CRT" hack lets you list subdomains associated with a primary domain using public certificate data. Just type: . name/v1/search?apex=[domain-name-here] Replace [domain-name-here] with the domain you want to check, and it'll show the matching subdomains. No installation... No complicated setup... Just one URL. Watch the video for a quick demo :) Follow me for more amazing AI, Coding & Web Dev insights. 💎

Ram Maheshwari

57,569 views • 17 days ago

WTF Broooooooooooooooooo... this is HEAVEN for anyone using AI to build UIs. 🤯 It's a massive collection of agentic UI skills that help AI coding agents build better-looking, more polished interfaces. You can explore skills across different categories like colors, architecture, design systems, frontend development, and much more. Let's be honest... AI can generate some serious UI slop by default. But with the right skills and a little design knowledge, you can turn that slop into an absolute MASTERPIECE. 🔥 If you're a developer, designer, or vibe-coder, you NEED to bookmark this :) Follow me for more amazing AI, Coding & Web Dev insights 💎

WTF Broooooooooooooooooo... this is HEAVEN for anyone using AI to build UIs. 🤯 It's a massive collection of agentic UI skills that help AI coding agents build better-looking, more polished interfaces. You can explore skills across different categories like colors, architecture, design systems, frontend development, and much more. Let's be honest... AI can generate some serious UI slop by default. But with the right skills and a little design knowledge, you can turn that slop into an absolute MASTERPIECE. 🔥 If you're a developer, designer, or vibe-coder, you NEED to bookmark this :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

23,173 views • 8 days ago

Brooooooooooooo... this feels like a dream come true for every developer & designer. 🦴 Now you don't have to manually design skeleton screens for your UI. Boneyard automatically extracts the layout from your real UI and generates pixel-perfect skeleton loading screens from it. Just wrap your UI components with Boneyard, run the build, and it creates the skeletons for you :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Brooooooooooooo... this feels like a dream come true for every developer & designer. 🦴 Now you don't have to manually design skeleton screens for your UI. Boneyard automatically extracts the layout from your real UI and generates pixel-perfect skeleton loading screens from it. Just wrap your UI components with Boneyard, run the build, and it creates the skeletons for you :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

55,108 views • 2 months ago

In this demo, discover how to define and launch a reproducible development environment with Workshop. Watch the full talk on YouTube to learn more: #Ubuntu #Linux #DevTools

In this demo, discover how to define and launch a reproducible development environment with Workshop. Watch the full talk on YouTube to learn more: #Ubuntu #Linux #DevTools

Ubuntu

23,757 views • 4 months ago

WTF Brooooooooooo... why didn't I find this earlier? 🤯 This browser extension lets you add multiple devices with different screen sizes directly to a webpage to test responsive designs. It comes with tons of customization options, and you can even sync scrolling across all your device previews simultaneously. Perfect for UI developers, designers, vibe coders, or anyone using AI to ship web products :) Follow me for more amazing AI, Coding & Web Dev insights 💎

WTF Brooooooooooo... why didn't I find this earlier? 🤯 This browser extension lets you add multiple devices with different screen sizes directly to a webpage to test responsive designs. It comes with tons of customization options, and you can even sync scrolling across all your device previews simultaneously. Perfect for UI developers, designers, vibe coders, or anyone using AI to ship web products :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

63,259 views • 2 months ago

✨ I started working on CSS Pro to rethink the way we work with CSS. 💡 There had to be a better way than relying solely on the browser's Devtools. 🔥 Now CSS Pro is LIVE on Product Hunt 😸! 💫 A re-imagined Devtools for web design: 👉

✨ I started working on CSS Pro to rethink the way we work with CSS. 💡 There had to be a better way than relying solely on the browser's Devtools. 🔥 Now CSS Pro is LIVE on Product Hunt 😸! 💫 A re-imagined Devtools for web design: 👉

Guilherme Rizzo

10,309 views • 3 years ago

Holy Sh*t... You can now share your localhost with anyone using only VS Code! 🤯 VS Code has a built-in Ports feature that lets you expose your local server to the internet, no need for third-party tools. Here’s how to use it: 1) Open the Ports tab in the terminal panel 2) Click Forward a Port 3) Enter your local port number (mine was 5173, yours could be 3000, 3001, etc.) 4) VS Code will generate a link, right-click and select Make Public 5) Copy the link and share it with anyone Perfect for demos, testing on other devices, or sharing work with clients and teammates :) Watch the video for a step-by-step demo 🎥 Follow me for more amazing AI, Coding & Web Dev insights 💎

Holy Sh*t... You can now share your localhost with anyone using only VS Code! 🤯 VS Code has a built-in Ports feature that lets you expose your local server to the internet, no need for third-party tools. Here’s how to use it: 1) Open the Ports tab in the terminal panel 2) Click Forward a Port 3) Enter your local port number (mine was 5173, yours could be 3000, 3001, etc.) 4) VS Code will generate a link, right-click and select Make Public 5) Copy the link and share it with anyone Perfect for demos, testing on other devices, or sharing work with clients and teammates :) Watch the video for a step-by-step demo 🎥 Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

59,272 views • 3 months ago

WTF Dude... this is like PDF parsing on steroids, NGL. 🤯 OpenDataLoader PDF is a free, open-source PDF parser that converts PDFs into AI-ready Markdown, JSON, and HTML. It can also use OCR for scanned PDFs and handle complex content like tables, formulas, and charts. Perfect for building RAG pipelines, AI agents, search systems, and other AI apps that need to actually understand PDF documents :) Follow me for more amazing AI, Coding & Web Dev insights 💎

WTF Dude... this is like PDF parsing on steroids, NGL. 🤯 OpenDataLoader PDF is a free, open-source PDF parser that converts PDFs into AI-ready Markdown, JSON, and HTML. It can also use OCR for scanned PDFs and handle complex content like tables, formulas, and charts. Perfect for building RAG pipelines, AI agents, search systems, and other AI apps that need to actually understand PDF documents :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

28,680 views • 2 months ago

Dude... This is ridiculously useful 🤯 A site that's like a swiss army knife for devs & designers. Which contains a collection of small, browser-based tools across different categories that work without logins, tracking, or data collection. Nice to bookmark if you like fast, no-BS tools that just work :) Source 🔗: tools . rmv . fyi Follow me for more amazing AI, Coding & Web Dev insights 💎

Dude... This is ridiculously useful 🤯 A site that's like a swiss army knife for devs & designers. Which contains a collection of small, browser-based tools across different categories that work without logins, tracking, or data collection. Nice to bookmark if you like fast, no-BS tools that just work :) Source 🔗: tools . rmv . fyi Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

91,877 views • 3 months ago

today it's my birthday, and i'm shipping inspekt hover any element to instantly inspekt fonts, colors, spacing, and css no devtools. no digging copy all you need in one click grab inspekt below 👇

today it's my birthday, and i'm shipping inspekt hover any element to instantly inspekt fonts, colors, spacing, and css no devtools. no digging copy all you need in one click grab inspekt below 👇

hamza

10,593 views • 3 months ago

Bruh... This GitHub hack is Wild AF 🤯 It literally lets you open any repository in an AI workspace. Simply add "explain" before "github" in any repo URL, and boom... now you can explore the codebase, ask questions, understand the architecture, generate onboarding reports, and get file-cited answers in seconds. If you work with open-source projects, this is definitely worth saving :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Bruh... This GitHub hack is Wild AF 🤯 It literally lets you open any repository in an AI workspace. Simply add "explain" before "github" in any repo URL, and boom... now you can explore the codebase, ask questions, understand the architecture, generate onboarding reports, and get file-cited answers in seconds. If you work with open-source projects, this is definitely worth saving :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

15,109 views • 3 months ago

WTF Broooooooo???? .... This feels like a goldmine for vibe coders 🌋 It's a collection of free UI prompts for things like hero sections, pricing pages, auth screens, bento grids, dashboards, and more. You can copy a prompt and give it to your AI coding agent to generate better-looking, less generic UI without having to describe every design detail yourself. Perfect if you build websites with AI and want your UIs to stand out :) Follow me for more amazing Coding, AI & Web Development insights 💎

WTF Broooooooo???? .... This feels like a goldmine for vibe coders 🌋 It's a collection of free UI prompts for things like hero sections, pricing pages, auth screens, bento grids, dashboards, and more. You can copy a prompt and give it to your AI coding agent to generate better-looking, less generic UI without having to describe every design detail yourself. Perfect if you build websites with AI and want your UIs to stand out :) Follow me for more amazing Coding, AI & Web Development insights 💎

Ram Maheshwari

66,288 views • 2 months ago

Broooooooooo.... this is sooo damn coooool to add Glass Effects in any UI. 😍 This free tool lets you generate stunning glassmorphism effects with plenty of customization options. It even supports liquid-glass and neumorphic designs. Once you're done, simply copy the code and start using it in your vibe coded or custom coded projects :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Broooooooooo.... this is sooo damn coooool to add Glass Effects in any UI. 😍 This free tool lets you generate stunning glassmorphism effects with plenty of customization options. It even supports liquid-glass and neumorphic designs. Once you're done, simply copy the code and start using it in your vibe coded or custom coded projects :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

31,736 views • 2 months ago

Broooooooooo.... this is sooo damn coooool to add Glass Effects in any UI. 😍 This free tool lets you generate stunning glassmorphism effects with plenty of customization options. It even supports liquid-glass and neumorphic designs. Once you're done, simply copy the code and start using it in your vibe coded or custom coded projects :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Broooooooooo.... this is sooo damn coooool to add Glass Effects in any UI. 😍 This free tool lets you generate stunning glassmorphism effects with plenty of customization options. It even supports liquid-glass and neumorphic designs. Once you're done, simply copy the code and start using it in your vibe coded or custom coded projects :) Follow me for more amazing AI, Coding & Web Dev insights 💎

Ram Maheshwari

14,832 views • 1 month ago