The picks

Every pick

Every tool, feature, and article we've found, newest first. Sign in or go Pro to search, filter, and see ratings.

135

Picks scored

57

Tools scored

32

Tools rated 7+

57

Deep dives

Full ratings and deep dives are for Pro members.

Showing 57 tools

Affinity
Affinity

Unified free desktop suite for vector, photo, and layout — now under Canva.

Desktop AppVectorPhoto EditingLayout
Deep diveVisit ↗
Framer
Framer

AI-native no-code site builder with full design control and production-grade hosting.

AINo-codePrototypingWebsite Builder
Deep diveVisit ↗
Miro
Miro

Infinite canvas for collaborative whiteboarding, wireframing, and cross-functional design workshops.

CollaborationWhiteboardingDiagrammingPrototyping
Deep diveVisit ↗
Notion
Notion

All-in-one workspace for docs, wikis, and project tracking used by design teams.

AICollaborationDocumentationProject Management
Deep diveVisit ↗
Paper
Paper

AI-agent-native design tool where the canvas is real HTML/CSS, not a Figma-style abstraction.

AICollaborationDesign-to-codeNo-code
Deep diveVisit ↗
Webflow
Webflow

Visual no-code builder that takes designers from design to live site without developers.

No-codeWeb DesignCMSPrototyping
Deep diveVisit ↗
Sketch
Sketch

Mature Mac-native UI design tool with solid component and collaboration features.

UI DesignPrototypingDesign SystemsmacOS
Deep diveVisit ↗
Figma
Figma

The industry-standard design tool every working UI/UX designer relies on daily.

FigmaUI DesignPrototypingAI
Deep diveVisit ↗
Originkit
Originkit

Free animated component library usable in Framer, code, or via MCP.

FramerComponentsAnimationNo-code
Deep diveVisit ↗
Hallmark
Hallmark

Prompting layer that pushes AI coding tools toward better, less generic design output.

AIPromptingCodeDesign Quality
Deep diveVisit ↗
szum
szum

Single JSON definition renders consistent charts across Figma, code, and AI agents.

AIFigmaData VizDesign Systems
Deep diveVisit ↗
Dspack Studio
Dspack Studio

AI agent generates UI constrained and governed by your existing design system.

AIDesign SystemsUI GenerationNo-code
Deep diveVisit ↗
Maxon Autograph
Maxon Autograph

Free After Effects alternative from Maxon for motion graphics and animation.

Motion GraphicsAnimationAfter EffectsFree Tool
Deep diveVisit ↗
tiks
tiks

Generate UI sound effects procedurally without any audio files.

Sound DesignPrototypingInteractionNo-code
Deep diveVisit ↗
a11y.quest
a11y.quest

Quiz-based accessibility learning tool covering WCAG, ARIA, and semantic HTML.

AccessibilityWCAGLearningTypography
Deep diveVisit ↗
Getdesign.md
Getdesign.md

Ready-made design system analyses from real sites, usable as AI coding agent context.

AIDesign SystemsDeveloper HandoffReference
Deep diveVisit ↗
MarkerOn
MarkerOn

Lightweight keyboard-first screen annotation tool that works across any app.

AnnotationProductivityDesktopTauri
Deep diveVisit ↗
LocaleProof
LocaleProof

Figma plugin that flags text overflow caused by translated string expansion.

FigmaInternationalizationLocalizationPlugin
Deep diveVisit ↗
Liquid Glass Component Library
Liquid Glass Component Library

Glassmorphism-style UI component library inspired by Apple's liquid glass aesthetic.

UI ComponentsGlassmorphismDesign SystemsApple
Deep diveVisit ↗
Show HN: Open-source library to copy-paste HTML into Figma as editable layers
Show HN: Open-source library to copy-paste HTML into Figma as editable layers

Copy-paste rendered HTML directly into Figma as fully editable layers.

FigmaOpen-sourceHTMLWorkflow
Deep diveVisit ↗
IconsCove
IconsCove

AI icon generator with 50+ styles, commercial use, and non-expiring credits.

AIIconsAsset GenerationWorkflow
Deep diveVisit ↗
Moodboard 3000
Moodboard 3000

Instantly composes selected Figma images into polished moodboard layouts.

FigmaMoodboardLayoutWorkflow
Deep diveVisit ↗
Intervool
Intervool

AI tool that transforms raw customer interviews into personas, insights, and prioritized roadmaps.

AIUX ResearchPersonasRoadmapping
Deep diveVisit ↗
Astryx
Astryx

Open-source, customizable design system built for AI agent workflows.

AIDesign SystemsOpen-sourceComponents
Deep diveVisit ↗
Weave
Weave

Weave integrates creative workflows directly alongside Figma frames for designers.

FigmaWorkflowIntegrationCollaboration
Deep diveVisit ↗
Words of Type
Words of Type

Reference encyclopedia of typographic terminology across multiple languages.

TypographyReferenceMultilingual
Deep diveVisit ↗
Adobe Creative Cloud
Adobe Creative Cloud

Adobe CC suite gets meaningful editing upgrades across Photoshop, Illustrator, and more.

AdobePhotoshopIllustratorWorkflow
Deep diveVisit ↗
Extend UI
Extend UI

Open-source React UI kit for document-heavy apps with viewers and e-signing.

ReactUI KitComponentsNo-code
Deep diveVisit ↗
Color Lab
Color Lab

Interactive 3D color space explorer that generates perceptually uniform palettes for design systems.

ColorDesign SystemsData VizTypography
Deep diveVisit ↗
Know Your Shortcuts
Know Your Shortcuts

Interactive 3D keyboard visualizer for learning app-specific keyboard shortcuts.

ProductivityLearningShortcutsKeyboard
Deep diveVisit ↗
Boneyard
Boneyard

Auto-generates pixel-perfect skeleton loading screens directly from your real DOM.

UI ComponentsDeveloper HandoffPrototypingNo-code
Deep diveVisit ↗
ColorMeUp Lab
ColorMeUp Lab

OKLCH-based color scale generator built for design system token workflows.

ColorDesign SystemsTokensTypography
Deep diveVisit ↗
fonts.xyz
fonts.xyz

Curated directory connecting designers with independent type foundries and fonts.

TypographyFontsDirectoryIndependent
Deep diveVisit ↗
pdf.to.design
pdf.to.design

Converts static PDFs into fully editable, layered Figma files instantly.

FigmaProductivityImportPDF
Deep diveVisit ↗
DESIGN.md
DESIGN.md

Open-source design system prompts to guide AI in generating consistent UIs.

AIDesign SystemsOpen-sourceUI Generation
Deep diveVisit ↗
contrast-color()
contrast-color()

Native CSS function that auto-selects accessible text color based on background contrast.

CSSAccessibilityDesign SystemsTypography
Deep diveVisit ↗
Figmode
Figmode

Vi-style modal keyboard shortcuts plugin for power users living in Figma.

FigmaProductivityKeyboard ShortcutsPlugin
Deep diveVisit ↗
Impeccable
Impeccable

Curated AI prompt commands to produce better frontend design output across coding tools.

AIFrontendPromptingDesign Systems
Deep diveVisit ↗
AIMirror
AIMirror

AI-powered analytics that explains why users struggle, not just what they did.

AIAnalyticsUX ResearchPrototyping
Deep diveVisit ↗
Fontastic Space
Fontastic Space

Free tool to compare Google Fonts with anatomy overlays and pairing scores.

TypographyGoogle FontsFree toolFont Pairing
Deep diveVisit ↗
Proposalkit
Proposalkit

Proposal creation tool for small agencies with design control and analytics.

ProposalsAgencyNo-codeAnalytics
Deep diveVisit ↗
Cladd
Cladd

React UI kit built for dense dashboards, editors, and complex app interfaces.

ReactUI KitDashboardsComponents
Deep diveVisit ↗
ds.shadcn
ds.shadcn

Shadcn UI components tailored for building design tool interfaces.

UI ComponentsNo-codeDesign SystemsReact
Deep diveVisit ↗
html.to.design
html.to.design

Instantly convert live webpages into editable Figma layers with one paste.

FigmaWorkflowChrome ExtensionImport
Deep diveVisit ↗
theSVG
theSVG

Massive open-source brand icon library with flexible framework and CDN delivery options.

IconsOpen-sourceDeveloper handoffSVG
Deep diveVisit ↗
3Dsvg
3Dsvg

Free SVG-to-3D converter with animation and export capabilities.

3DSVGAnimationExport
Deep diveVisit ↗
Nudges
Nudges

Interactive reference cards for cognitive biases and AI-specific design phenomena.

AIUX ResearchPsychologyReference
Deep diveVisit ↗
MoBrowser App Icon Maker
MoBrowser App Icon Maker

AI-powered open source macOS app icon generator for rapid prototyping.

AImacOSIcon DesignOpen Source
Deep diveVisit ↗
Glide Design AI
Glide Design AI

AI-assisted design tool for rapid UI creation and prototyping workflows.

AIPrototypingNo-codeUI Design
Deep diveVisit ↗
ProtoPie
ProtoPie

Integrated user testing in ProtoPie eliminates tool-switching for prototype validation workflows.

PrototypingUser TestingNo-code
Deep diveVisit ↗
CopyProps
CopyProps

Figma plugin for exporting element properties as text format.

FigmaPluginWorkflowDocumentation
Deep diveVisit ↗
ezscreenshots
ezscreenshots

Lightweight HTML/CSS/JS tool for creating App Store screenshots quickly.

App MarketingNo-codeLightweightAutomation
Deep diveVisit ↗
F2C
F2C

Converts Figma designs to production-ready React/Vue code directly in VSCode.

Code GenerationFigmaReact/VueDeveloper Tools
Deep diveVisit ↗
Better Design
Better Design

Collection of Shadcn design systems integrated with AI coding assistants.

Design SystemsComponent LibraryAI-AssistedOpen Source
Deep diveVisit ↗
Figma Design Extraction Plugin
Figma Design Extraction Plugin

Figma plugin automating design system documentation from local styles.

FigmaDesign SystemsDocumentationAutomation
Deep diveVisit ↗
Shieldcn
Shieldcn

Shadcn-styled badge generator with GitHub/npm integrations for README files.

BadgesDocumentationGitHubShadcn
Deep diveVisit ↗
Designtools.fyi
Designtools.fyi

Comprehensive comparison platform helping designers evaluate and select appropriate design tools.

Tool ComparisonResearchWorkflow SelectionDesign Stack
Deep diveVisit ↗