nowfound

Dev tools · January 20, 2025

SI

StyleKit – Instant Website Design Analyzer Chrome Extension

Hi HN, StyleKit is a Chrome extension I developed to help teams quickly capture and document website design systems. It's free to download and use. As someone who works on both design and development, I frequently study and record how websites look for different projects, or document the design of other sites for an aspect I really liked. This takes a lot of my time: opening web developer, finding style classes, viewing the computed style to see what was actually happening, and then storing information I wanted to save. Sometimes I couldn't find an element either way. I created StyleKit to…

What it does

In the maker’s words, at launch

Hi HN, StyleKit is a Chrome extension I developed to help teams quickly capture and document website design systems. It's free to download and use. As someone who works on both design and development, I frequently study and record how websites look for different projects, or document the design of other sites for an aspect I really liked. This takes a lot of my time: opening web developer, finding style classes, viewing the computed style to see what was actually happening, and then storing information I wanted to save. Sometimes I couldn't find an element either way. I created StyleKit to streamline this process. It instantly generates a comprehensive design system document (a "StyleKit") for any website, capturing colors, typography, logos, and design patterns. The extension works entirely in the browser, requiring no external processing. Key features include: * Instant StyleKit generation with color palette, typography system, and design pattern identification * Export options including one-click element copying, PDF documentation, and portable HTML file * Real-time design analysis with interactive element highlighting and usage statistics I'd love to hear your thoughts and feedback on StyleKit.

Does the same job

all alternatives →
  • StyleKit.io2025 · ▲52

    Beautiful PDF style guide & instant on-page element analysis

  • ExtensionKit 2.02023 · ▲118

    Build your next Chrome Extension project faster than ever

  • StyleKit2016 · ▲120

    UI framework for OSX

  • Flowkit2017 · ▲296

    Sketch library for user flows/content maps/annotations

  • Font Face Ninja2014 · ▲196

    Browser extension to quickly find the webfonts a site uses

  • CSS Peeper2017 · ▲349

    Smart CSS viewer tailored for Designers.

More dev tools this month

the category →
  • Dograh592

    The open source VAPI alternative

    Dev tools · 25d ago · dograh.com

  • Meridian530

    Don't let your work go unnoticed. Get promoted!

    Dev tools · 20d ago · meridiona.com

  • x1516

    Lovable for iPhone apps go from idea to App Store

    Dev tools · 11d ago · x1.new

  • Open-source GTM skills for technical founders

    Dev tools · 29d ago · gtmcofounder.com

  • OpenTrailPaper is open-source bike computer firmware for the LilyGO T5S3 4.7" E-Paper PRO. It supports offline maps, GPX routes, FIT recording and Bluetooth sensors.

    Dev tools · 2d ago · opentrailpaper.com

  • Nuphos380

    The AI-Native DevOps Workspace.

    Dev tools · 24d ago · nuphos.ai

Launched alongside, January 2025

the whole month →
  • IM

    Hello! I'm Byran. I spent the past ~6 months engineering a laptop from scratch. It's fully open-source on GH at: https://github.com/Hello9999901/laptop

    Dev tools · 2025 · byran.ee

  • TI

    I realized that the PDF engines of modern desktop browsers (PDFium and PDF.js) support JavaScript with enough I/O primitives to make a basic game like Tetris. It was a bit tricky to find a union of features that work in both engines, but in the end it turns out that showing/hiding annotation "fields" works well to make monochrome pixels, and keyboard input can be achieved by typing in a text input box. All in all it's quite janky but a nice reminder of how general purpose PDF scripting can be. The linked PDF is all ASCII so you can just open it in a text editor, or have a look at…

    Life & fun · 2025 · th0mas.nl

  • 21st.dev1,211

    Github + Pinterest to make your AI websites look beautiful

    Dev tools · 2025 · 21st.dev

  • Stay in flow by blocking distracting apps and websites

    Work · 2025 · raycast.com

  • Create lifelike, personalized AI avatars from text prompts

    AI · 2025 · jogg.ai

  • Turn Figma designs into full stack apps with AI

    Dev tools · 2025 · figma.com