Author: M4Design

  • icon systems: the part of your design system everyone assumes is easy

    icon systems: the part of your design system everyone assumes is easy

    Icons are the last thing you document and the first thing that breaks consistency. Most design systems ship with icons pulled from three different libraries, sized at 16px here and 24px there, with stroke weights that don’t match the UI they sit in. Nobody planned it that way — it just happened one component at…

  • type scale

    type scale

    A type scale is a sequence of font sizes built on a single ratio — so every size in your system is mathematically related to every other. Pick a base size (usually 16px) and a ratio (1.25 is modest, 1.5 is expressive) and multiply up and down from there. Token each step by role —…

  • spacing systems: the token you forgot to build

    spacing systems: the token you forgot to build

    Most design systems nail color and type — then leave spacing as a free-for-all. Spacing tokens are the quietest part of a design system and the most overlooked. Designers spend hours defining a perfect color palette, a harmonious type scale, a complete component library — then type `margin: 13px` directly into a component and move…

  • 3dicons

    3dicons

    A free, open-source library offers over 1,500 hand-crafted 3D icons, available in various angles and color variants for mockups and UI. A Figma plugin simplifies icon integration, while a pro tier provides an online editor for customization. Developed by Vijay Verma, icons require no attribution.

  • design tokens

    design tokens

    A design token is just a named variable that stores a design decision — color, spacing, type size — so your whole system can change from one place. Instead of hardcoding `#0d0d0d` in fifty places, you define `–ink: #0d0d0d` once and reference the name everywhere. When the value changes, everything updates. Tokens create the contract…

  • TINYWOW

    TINYWOW

    a popular free, all-in-one online toolkit designed to simplify a wide range of digital tasks from editing PDFs and images to generating content with AI, it’s a web-based platform that requires no software installation or registration for basic use, making it highly accessible for students, professionals, and content creators. https://tinywow.com

  • higgsfield ai

    higgsfield ai

    Generate ai videos and images with cinematic quality, visual effects and ready presets. Professional AI tools for creators, marketers, and businesses. “Our brand-new GenAI video platform designed specifically for creative professionals like musicvideo directors, commercial filmmakers, AI creators, and social media storytellers who want toproduce high-quality, stylized content with true cinematic control.This new product is a…

  • ISOCONS

    ISOCONS

    Free comprehensive collection of customizable isometric 3D icons that can be integrated into any project. This is a collection of carefully crafted, customizable isometric icons designed for use in UI/UX design, web development, apps, and presentations.Key Features:A diverse library of vector icons (SVG format) across multiple categories.Figma plugin for easy integration into design projects.Customizable options…

  • The Component Gallery

    The Component Gallery

    The Component Gallery is a collection of interface components from real-world design systems.

  • MAKE

    MAKE

    AI Workflow Automation Software & Tools Make allows you to visually build, scale and automate AI and agentic workflows. User friendly no-code integration tool. Automate your work. https://www.make.com/en