DESIGNER WEAPONS

The 2 Million dollar killer arsenal for Product DESIGNERS

By employing this website, you are saving millions of dollars in development time, graphic design work, design system development, QA testing and deployment. You are getting access to designer resources that have saved modern designers many headaches and having to do it "from scratch" This is an arsenal of resources for the designer who is resourceful, creative and mostly: PRACTICAL. This is not about being artsy or cute, this is about being able to create digital goods and services in a fast way using the best work from the best people.

Formspree

The form solution for any developer: Use your own frontend code. Submit to our API. We'll handle the rest.

Uizard - From Scribbles to Screens

Sketch an idea on a napkin and Uizard will turn it into a prototype faster than you can say “low-fidelity wireframe.” No magic wand required—just AI.

Framer - AI Prototypes that Work

Why stop at static designs? Framer lets you build real, interactive prototypes with React-ready code. Designers, meet your new best dev friend.

Builder.io - Drag, Drop, Deploy

It’s a visual CMS that speaks fluent React, Vue, and performance. Your designs deserve more than screenshots—give them life.

Anima - Figma to Code Wizardry

Anima lets you export your Figma designs into usable code like HTML, CSS, and React. Great for when “developer handoff” just means sending a prayer.

Visily - AI UI Creator

Feed it screenshots or rough ideas—Visily uses AI to spit out sleek UI designs. Because drawing rectangles isn’t the best use of your time.

Magic Design by Canva - Design in Seconds

Upload an idea, and Canva's AI will whip up full designs in seconds. Perfect for when your creative brain hits snooze.

Runway - Next-Level AI Video Tools

From background removal to full AI-generated scenes, Runway makes your motion designs look Hollywood-level. No crew required.

Khroma - AI Color Palette Genius

Stop guessing colors. Train Khroma with your favorites, and it generates infinite palettes you’ll actually want to use. Color theory, meet machine learning.

Microsoft Designer - AI Social Post Wizard

Create beautiful social graphics with a sprinkle of AI and zero stress. Your next post will look like it took hours (it didn’t).

Let's Enhance - Upscale with AI

Got a pixelated image? Let’s Enhance will upscale and clean it like it went to a spa. Say goodbye to blurry assets forever.

TinyWow - Big Solutions for Small Problems

Need to compress a PDF, convert an image, or perform 57 random tasks you didn’t know you’d need today? TinyWow does it all. Think of it as the Swiss Army knife of the internet—tiny but mighty!

CSS-Tricks - Your CSS Bible

If you’ve ever Googled “how to center a div,” you owe CSS-Tricks an apology for not bookmarking it sooner. It’s the holy grail of CSS tips.

Cubic Bezier - Animate Like a Pro

This tool is for when you want your animations smoother than your morning coffee. Play with curves and make the internet dance.

SVGOMG - Optimize Your SVGs

SVGOMG: because sending bloated SVGs is so last season. Shrink those files faster than you can say “image optimization.”

Can Include - CSS @supports Tester

A tool for when you’re not sure if your CSS properties are supported or if your browser is just gaslighting you. Test before you stress.

W3C Web Accessibility Initiative

Accessibility: not just a buzzword. Learn how to make your site usable for everyone, including your grandma and her cat.

Codrops - Design Experiments

Codrops is where designers go when they’re bored of buttons that just sit there. Find creative UI ideas to make users say “wow!”

Get Waves - SVG Wave Generator

Make waves—literally. Use this tool to create stunning SVG wave patterns and surf your way to a beautiful design.

Polypane - Browser for Web Designers

A browser that shows multiple responsive views at once. Now you can fix that button alignment without juggling 27 Chrome tabs.

UX Collective - Design Stories

A collection of UX stories and case studies that’ll make you rethink that 7-step onboarding flow. Learn from the best (and worst).

Color Review - Accessibility in Colors

Because not everyone sees colors the way you do. Test your palettes for accessibility and make sure your site isn’t 50 shades of unreadable.

Uizard - AI-Powered Prototypes

Uizard turns your scribbles into prototypes faster than you can explain what a “wireframe” is. It’s like magic, but nerdier.

DeepAI Designer - Auto Layouts

DeepAI Designer doesn’t just generate layouts; it reads your mind and creates designs you didn’t even know you wanted. Spooky, huh?

Webflow - Visual Code Generator

Webflow: where design meets development without the awkward “what do you do?” small talk. Click, drag, deploy. Easy.

Dreamweaver AI - Enhanced Code Suggestions

Dreamweaver is back from the early 2000s with AI powers. Now it’ll nag you about syntax errors in style. Nostalgia meets efficiency.

Framer - Interactive Prototypes to Code

Framer doesn’t just prototype—it whispers sweet React components into your codebase. Cupid for devs and designers.

Builder.io - Visual CMS

Builder.io turns your designs into React/Vue sites. It’s like hiring a developer who never sleeps and doesn’t complain.

Anima - Convert Figma to Code

Anima lets you skip the awkward “I can’t code” phase by turning your Figma designs into actual code. Sorcery, basically.

TeleportHQ - AI-Powered Code Generation

TeleportHQ: because coding from scratch is so 2010. Let AI do the boring parts while you take the credit.

Locofy.ai - Design to Code

Locofy transforms your design files into code faster than you can say “debugging sucks.” It’s a dev’s best friend.

Stablecog - AI Code Design

Stablecog writes better code than most junior devs. Just don’t tell your teammates, or they might get replaced by this AI genius.

Multi-theme illustration freebies

Browse to find the images that fit your needs and click to download. Use the on-the-fly color image generation to match your project's identity.

Shoelace - style library with agnostic components

This resource is sort of a bootstrap with some additional powers, the documentation site is also slick and you can get started with rather rapidly.

The most powerful ICON Library ever, period.

Are you friking nuts trying to create web icons? Stop the insanity and simply plug in Material Icons from Google.

Simple and highly customizable CSS PATTERNS

Take a look at this minimalistic yet beautiful CSS components library. An agnostic design system that you can reskin the way you like.

One Line LAYOUTS and how to do them the modern way

Total FLEXGRID for any project

Because you deserve to jump into real CSS, this magical grid is all baked-in for your project.

You won't believe how old is the oldest PIECE OF SOFTWARE until you read this

There is software out there that belong to the times of your granpa, he probably heard about this...

GRID by Example

Learn to use CSS grid with simple examples that you can reuse and recreate yourself. No need for extensive documentation, simply try the examples and get your grid going.

Input modes: how to trigger different keyboards in Mobile phones

Now we can "hint" the browser what virtual keyboard we want to show on mobile devices without forcing the browser to change the visuals of the input. (unlike with input="number" for example)

Amp framework for fast web mobile pages

AMP is a simple and robust format to ensure your website is fast, user-first, and makes money. AMP provides long-term success for your web strategy with distribution across popular platforms and reduced operating and development costs.

Go back in time with the mega RETRO Keyboard

It is the reality, all new keyboards look like they come from the future, or a star wars movie, but what about batman from the 60's? that's the piece of machinery we're talking about.

The Nightmares of Web Design and how to overcome them: An essential guidebook for UI/UX designers

CODEPEN
a the social coding platform

Because there is no need to pull the text editor when you can have a playground on the browser

Anime JS power

Make things move with this library that can be plugged anywhere

OnSEEN Framework: The solution for building native-like web applications and sites.

The fastest way to develop beautiful HTML5 hybrid and mobile web apps Experience streamlined development with zero-time setup, using the technologies you already know and love - Javascript, HTML and CSS.

A rich variety of UI components specially designed for mobile apps. Onsen UI provides tabs, side menu, stack navigation and tons of other components such as lists and forms. They all have iOS and Android Material design support, with automatic styling that will change the appearance of the app based on the platform. With Onsen UI you can truly support both Android and iOS with the same source code.

Classless: the CLASS FREE framework

Remember when CSS was made to stylize HTML? when did we get into the rabbit hole of applying tons of useless classes to each div? - Time to step back to the roots.

The power of serverless

Making websites without a server makes no sense but... serverless is the hot sauce now.

Beautiful loaders for your WEB

Instead of letting your users wait like idiots, trick them up with spinners so they are distracted while your unnesesarily heavy-page loads up

DIVLESS: The CSS Microlibrary that doesn't require DIVS

The Brutalism trend has tought us to design raw, to use the the naked materials of the HTML and create sites that are not decorated nor shiny, this framework somehow does what it needs to do: allows you to focus on content, minimal css and almost zero class names to take care of.