Skip to content
goodtabs

Utilities

Small tools for color, images, CSS, debugging and getting things done.

Updated 22 Oct 2026

  • Realtime Colors

    realtimecolors.com

    Preview a palette on a real page layout before committing to it.

    palettepreviewFree

  • Cap

    cap.so

    Open-source screen recorder, an alternative to Loom.

    recordingNewOpen source

  • Carbon

    carbon.now.sh

    Create and share images of your source code.

    code screenshotsFree

  • remove.bg

    remove.bg

    Remove image backgrounds in one click.

    background removalFreemium

  • Pika

    pika.style

    Screenshot beautifier with device frames and gradient backgrounds.

    screenshotsFreemium

  • ray.so

    ray.so

    Make code screenshots with themes and padding.

    code screenshotsFree

  • Tailwind Play

    play.tailwindcss.com

    Tailwind playground with an instant preview.

    tailwindplaygroundFree

  • Animista

    animista.net

    Pick, tweak and copy CSS animations.

    animationcssFree

  • Hoppscotch

    hoppscotch.io

    Open-source API client that runs in the browser.

    api clientOpen source

  • WebAIM Contrast Checker

    webaim.org

    The standard WCAG contrast checker, nothing more.

    contrastwcagFree

  • Accessible Palette

    accessiblepalette.com

    Build palettes with consistent lightness and contrast across hues.

    a11yscalesFree

  • Haikei

    haikei.app

    Generate SVG blobs, waves and backgrounds.

    svgbackgroundsFree

  • JSON Crack

    jsoncrack.com

    Visualize JSON, YAML and more as a graph.

    jsonvisualizerFreemium

  • Linear

    linear.app

    Issue tracking built for speed, with keyboard-first design.

    issueskeyboardFreemium

  • Shadow Palette Generator

    joshwcomeau.com

    Layered, color-tinted box shadows that look right.

    shadowsFree

  • CleanShot X

    cleanshot.com

    Screenshot and recording tool for Mac with annotation.

    screenshotsmacPaid

  • cubic-bezier

    cubic-bezier.com

    Visual editor for CSS timing functions.

    easinganimationFree

  • regex101

    regex101.com

    Build and debug regular expressions with explanations.

    regexFree

  • Shots

    shots.so

    Mockups and screenshots with backgrounds and device frames.

    mockupsscreenshotsFree

  • tints.dev

    tints.dev

    Generate Tailwind-style color scales from one base color.

    scalestailwindFree

  • Clippy

    bennettfeely.com

    Visual clip-path maker.

    clip-pathFree

  • OKLCH Color Picker

    oklch.com

    Pick and convert colors in OKLCH with gamut warnings.

    oklchpickerFree

  • Screen Studio

    screen.studio

    Screen recorder that makes polished demo videos automatically.

    recordingmacPaid

  • TinyPNG

    tinypng.com

    Smart lossy compression for PNG, JPEG and WebP.

    compressionFreemium

  • Transform

    transform.tools

    Convert between JSON, TypeScript, CSS, SVG, JSX and more.

    converterFree

  • CSS Grid Generator

    cssgrid-generator.netlify.app

    Draw a grid and copy the CSS.

    gridgeneratorFree

  • Huemint

    huemint.com

    Generated palettes applied to real UI and brand mockups.

    palettemockupsFree

  • npm trends

    npmtrends.com

    Compare download trends of npm packages.

    npmtrendsFree

  • Raycast

    raycast.com

    Launcher for Mac with extensions, snippets and AI.

    launchermacFreemium

  • SVGR Playground

    react-svgr.com

    Turn SVG files into React components.

    svgreactOpen source

  • Bundlephobia

    bundlephobia.com

    See what an npm package costs before you add it.

    npmbundle sizeFree

  • Coolors

    coolors.co

    Fast palette generator with export to many formats.

    paletteFreemium

  • Easings

    easings.net

    Cheat sheet of easing functions with CSS snippets.

    easinganimationFree

  • SVGOMG

    jakearchibald.github.io

    Optimize SVGs in the browser with every option exposed.

    svgoptimizeFree

  • tldraw

    tldraw.com

    Infinite canvas whiteboard with an SDK for building your own.

    whiteboardsdkOpen source

  • Can I use

    caniuse.com

    Browser support tables for web features.

    browser supportFree

  • Excalidraw

    excalidraw.com

    Hand-drawn style whiteboard for diagrams, with live collaboration.

    whiteboarddiagramsOpen source

  • Radix Colors

    radix-ui.com

    Accessible 12-step color scales with light and dark pairs.

    scalesa11yOpen source

  • Squoosh

    squoosh.app

    Compress and convert images in the browser with a side-by-side preview.

    compressionFree

  • Utopia

    utopia.fyi

    Fluid type and space scales with clamp(), output as CSS.

    fluid typespacingFree
40 shown of 40