Monoco: JavaScript-Bibliothek für Squircles und individuelle Eckenformen

LinkTool

Monoco ist eine schlanke JavaScript-Bibliothek, mit der HTML-Elemente mit Squircles (stetigen Kurven) und anderen Eckenstilen gerendert werden können. Sie erzeugt dynamische SVGs und wendet diese als Hintergrundbild oder Clip-Path an.

Das Wichtigste

  1. Erlaubt neben klassischen runden Ecken auch Squircles, inverse Rundungen, flache Ecken, Insets und eigene Formate.
  2. Funktioniert über dynamisch generiertes SVG als CSS-Hintergrundbild oder Clip-Path, wodurch Cross-Browser-Kompatibilität ohne CSS Houdini erreicht wird.
  3. Überwacht Größenänderungen von Elementen automatisch und passt die Kurven bei Dimensionswechseln neu an.
  4. Verfügbar für Vanilla JavaScript sowie als Komponenten für React und Svelte.

Warum das relevant ist

Da reguläres CSS bis zu einer breiten Unterstützung von CSS Houdini nur einfache Kreisradien unterstützt, weichen UI/UX-Designer für moderne Looks oft auf Squircles aus, wie sie etwa in Figma standardmäßig genutzt werden. Monoco schließt diese Lücke zwischen Design-Tools und Web-Frontend.

Einordnung

Monoco setzt auf einen pragmatischen SVG-basierten Ansatz, um Design-Features wie Apples bekannte Squircle-Formen unkompliziert im Browser darzustellen. Durch Framework-Integrationen für React und Svelte sowie automatische Größenüberwachung lässt sich das Tool direkt in bestehende Frontend-Komponenten einbinden.

Erwähnte Links

Gefunden in

Zusammenfassung von KI erstellt (Gemini 3.8 Flash, 6. Oktober 2026). Sie kann Fehler enthalten – maßgeblich ist die Originalquelle.

Ähnliche Einträge

Inhaltlich ähnlich, ermittelt über die KI-Suche.

  • X-Post:Noah

    Fünf Bibliotheken für UI-Mikrointeraktionen

    Noah (@noahelhadedy) teilt eine Auswahl von fünf spezialisierten Frontend-Bibliotheken für UI-Mikrointeraktionen, darunter Theme-Toggles, Audio-Feedback, Morphing-Übergänge, Squircles und Seitentransitionen.

    631Lesezeichen18.582Aufrufe

    Webentwicklung· Sammlung

  • Link:ssgoi.dev

    SSGOI: Framework-agnostische Seitenübergänge im Web

    SSGOI ist eine Bibliothek für native Seitenübergänge im Web. Sie basiert auf der Web Animations API und funktioniert unabhängig von konkreten Routern und UI-Frameworks.

    Webentwicklung· Tool

  • Repository:SLtowl/sl-ui-library

    SL UI Library: Interaktive UI-Komponenten mit KI-Plugin-Anbindung

    SL UI Library ist eine Open-Source-Sammlung von 388 interaktiven Benutzeroberflächen-Komponenten mit Exportoptionen für reines HTML/CSS/JS, React und Next.js sowie direkter Plugin-Integration für Claude Code und Codex.

    33SterneJavaScript

    KI & AI· Tool

  • Repository:cocopon/tweakpane

    Tweakpane: Schlanke GUI-Bibliothek zur Parametersteuerung im Browser

    Tweakpane ist eine abhängigkeitsfreie UI-Komponente für Webentwickler, um Parameter in Echtzeit zu steuern und Werte zu überwachen. Die von dat.GUI inspirierte Bibliothek richtet sich vor allem an Creative Coding, 3D-Demos und Frontend-Experimente.

    4630SterneTypeScript

    Webentwicklung· Tool

  • X-Post:Adham Dannaway

    Hairline: Interaktive isometrische SVG-Grafiken für das Web

    Hairline von Lucas Marques ist eine Bibliothek mit 33 isometrischen Linienzeichnungen für Websites. Die Grafiken reagieren direkt auf den Mauszeiger, kommen ohne externe Abhängigkeiten aus und lassen sich in React oder nativem DOM nutzen.

    113Lesezeichen4987Aufrufe

    Webentwicklung· Sammlung

Zurück zur Wissensbasis

Sprechen wir über Ihr Projekt.

Kontakt

Standorte

  • Mattersburg
    Johann Nepomuk Bergerstraße 7/2/14
    7210 Mattersburg, Austria
  • Wien
    Ungargasse 64-66/3/404
    1030 Wien, Austria

Ein Teil von diesem Inhalt wurde mit KI gemacht.