DEV Community

Cover image for Chrome Screenshot Specific Element
Chris Bongers
Chris Bongers

Posted on • Originally published at daily-dev-tips.com

2 1

Chrome Screenshot Specific Element

Did you know Chrome developer console comes with a whole hidden Command menu?

Well, I didn't know till a while ago, and it comes packed with cool features.

Today we are looking into making a screenshot of a specific element with it.

How to Screenshot a specific element

  • Inspect the element you wish to screenshot
  • Press Cmd + Shift + P | Ctrl + Shift + P to open the Command menu
  • Type Screenshot within the menu
  • Select the Capture node screenshot to capture the selected element.

View on Youtube

Wow, I hope your as excited about this hidden menu as I am.

Thank you for reading, and let's connect!

Thank you for reading my blog. Feel free to subscribe to my email newsletter and connect on Facebook or Twitter

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay