awesome-repositories.com
Blog
awesome-repositories.com

Entdecke die besten Open-Source-Repositories mit KI-gestützter Suche.

EntdeckenKuratierte SuchenOpen-Source-AlternativenSelf-hosted SoftwareBlogSitemap
ProjektÜber unsRanking-MethodikPresseMCP-Server
RechtlichesDatenschutzAGB
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
rough-stuff avatar

rough-stuff/wired-elements

0
View on GitHub↗
10,802 Stars·338 Forks·TypeScript·MIT·3 Aufrufewiredjs.com↗

Wired Elements

Wired-elements ist eine Web-Component-Bibliothek mit handgezeichnetem Stil, die eine Sammlung stilisierter HTML-Elemente für den Aufbau von Wireframes und Mockups bereitstellt. Sie dient als Wireframing-UI-Framework, das die Erstellung von Low-Fidelity-Prototypen mit einer skizzenhaften, manuellen Ästhetik ermöglicht.

Die Bibliothek bietet Komponenten für handgezeichnetes Webdesign und schnelles UI-Prototyping. Diese Elemente sind darauf ausgelegt, Low-Fidelity-Wireframing zu unterstützen, um Benutzeroberflächen zu planen und Layouts vor der High-Fidelity-Entwicklung zu testen.

Das Projekt nutzt eine Web-Component-Architektur mit SVG-basierten Vektorgrafiken, um einen konsistenten handgezeichneten Look beizubehalten. Es unterstützt die Integration in verschiedene JavaScript-Frameworks und nutzt CSS-Variablen für das Theming von Strichstärken und Farben.

Features

  • Hand-Drawn - Provides a collection of pre-built custom elements with a sketched, hand-drawn appearance for wireframing.
  • SVG-Based Vector Rendering - Uses SVG-based vector graphics to render a consistent hand-drawn aesthetic across various screen sizes.
  • UI Prototyping - Provides tools for rapidly constructing user interface layouts to validate design ideas without polished styling.
  • Wireframing Component Frameworks - Provides a set of interface components specifically designed to create low-fidelity prototypes that look like manual sketches.
  • Wireframing Software - Enables the creation of low-fidelity structural blueprints and sketches to plan user interfaces.
  • Web Component Libraries - Encapsulates styles and behavior within custom HTML elements for framework-agnostic integration into any web project.
  • CSS Variable Theming - Provides a theming system using CSS variables to customize stroke thickness and colors across all components.
  • Shadow DOM Utilities - Uses Shadow DOM to isolate hand-drawn styles and prevent CSS leakage between components and the global scope.
  • Frontend Component Integration - Allows for the rapid integration of pre-styled interface components into web projects to speed up layout prototyping.
  • UI Component Frameworks - Provides a set of pre-built user interface elements that can be integrated into various JavaScript frameworks.
  • Component Libraries - Hand-drawn style UI components.

Star-Verlauf

Star-Verlauf für rough-stuff/wired-elementsStar-Verlauf für rough-stuff/wired-elements

KI-Suche

Entdecke weitere awesome Repositories

Beschreibe in einfachen Worten, was du brauchst — die KI bewertet tausende kuratierte Open-Source-Projekte nach Relevanz.

Start searching with AI

Open-Source-Alternativen zu Wired Elements

Ähnliche Open-Source-Projekte, sortiert nach der Anzahl der gemeinsamen Funktionen mit Wired Elements.
  • wiredjs/wired-elementsAvatar von wiredjs

    wiredjs/wired-elements

    10,800Auf GitHub ansehen↗

    Wired Elements is a hand-drawn web component library and custom element UI kit. It provides a set of low-fidelity visual building blocks designed to produce a rough, non-polished aesthetic for early-stage design iterations. The framework enables the creation of rapid UI prototypes, low-fidelity wireframes, and conceptual UX mappings. It uses a sketched appearance to help focus iterations on layout and functionality rather than final visual polish. The library utilizes SVG-based path rendering and web component encapsulation to deliver its hand-drawn style. Visual states are managed through e

    TypeScript
    Auf GitHub ansehen↗10,800
  • shoelace-style/shoelaceAvatar von shoelace-style

    shoelace-style/shoelace

    13,860Auf GitHub ansehen↗

    Shoelace is a web component UI library consisting of a suite of accessible, framework-agnostic user interface elements. It provides a collection of custom element components and reusable HTML tags that encapsulate style and behavior to work across any JavaScript framework or plain HTML pages. The system is designed as a themable UI component system, utilizing CSS variables to manage visual themes and dark mode support. This allows for the implementation of custom design systems and a consistent visual language across web environments. The library covers broader capabilities in accessible int

    TypeScript
    Auf GitHub ansehen↗13,860
  • lukilabs/beautiful-mermaidAvatar von lukilabs

    lukilabs/beautiful-mermaid

    7,187Auf GitHub ansehen↗

    This project is a renderer and theme engine for Mermaid.js that converts diagram syntax into styled SVG graphics and ASCII text. It provides a type-safe diagram editor and a pipeline for transforming diagram source code into scalable vector graphics or plain text visuals. The system features a dedicated theme engine that maps editor colors and CSS variables to diagram elements. It enables dynamic diagram theming through CSS custom properties for real-time color updates and supports index-based styling to override the appearance of specific nodes and edges. The tool covers a range of visualiz

    TypeScript
    Auf GitHub ansehen↗7,187
  • zdhxiong/mduiAvatar von zdhxiong

    zdhxiong/mdui

    4,517Auf GitHub ansehen↗

    mdui is a framework-agnostic UI library and design system based on Material Design 3 standards. It provides a comprehensive set of reusable interface elements implemented as native Web Components, ensuring compatibility across different JavaScript frameworks. The library features a sophisticated theming system that supports light and dark modes, as well as the ability to generate dynamic color palettes from seed colors or image sources. It distinguishes itself with a high level of flexibility in visual customization, using CSS custom properties to control design tokens such as typography, cor

    TypeScriptcssjavascriptmaterial
    Auf GitHub ansehen↗4,517
Alle 30 Alternativen zu Wired Elements anzeigen→

Häufig gestellte Fragen

Was macht rough-stuff/wired-elements?

Wired-elements ist eine Web-Component-Bibliothek mit handgezeichnetem Stil, die eine Sammlung stilisierter HTML-Elemente für den Aufbau von Wireframes und Mockups bereitstellt. Sie dient als Wireframing-UI-Framework, das die Erstellung von Low-Fidelity-Prototypen mit einer skizzenhaften, manuellen Ästhetik ermöglicht.

Was sind die Hauptfunktionen von rough-stuff/wired-elements?

Die Hauptfunktionen von rough-stuff/wired-elements sind: Hand-Drawn, SVG-Based Vector Rendering, UI Prototyping, Wireframing Component Frameworks, Wireframing Software, Web Component Libraries, CSS Variable Theming, Shadow DOM Utilities.

Welche Open-Source-Alternativen gibt es zu rough-stuff/wired-elements?

Open-Source-Alternativen zu rough-stuff/wired-elements sind unter anderem: wiredjs/wired-elements — Wired Elements is a hand-drawn web component library and custom element UI kit. It provides a set of low-fidelity… shoelace-style/shoelace — Shoelace is a web component UI library consisting of a suite of accessible, framework-agnostic user interface… lukilabs/beautiful-mermaid — This project is a renderer and theme engine for Mermaid.js that converts diagram syntax into styled SVG graphics and… zdhxiong/mdui — mdui is a framework-agnostic UI library and design system based on Material Design 3 standards. It provides a… argyleink/open-props — Open Props is a CSS custom property library and design token set providing reusable variables for colors, typography,… taylorchen709/vue-admin — vue-admin is a Vue.js admin dashboard template and customizable admin theme. It serves as a starter kit and…