17 Repos
Generates SVG strings on the server for non-browser environments.
Distinct from Server-Side Rendering: Distinct from Server-Side Rendering: focuses on SVG output for infographics, not HTML for web pages.
Explore 17 awesome GitHub repositories matching web development · SVG Renderers. Refine with filters or upvote what's useful.
QuestPDF is a C# PDF generation library and layout engine used to create structured documents, reports, and invoices. It utilizes a fluent API and a component-based layout approach to convert code into high-fidelity PDF and XPS files. The library distinguishes itself with a dedicated layout debugger that provides real-time previews, hot-reload capabilities, and visual boundary tools to map rendered elements back to source code. It also functions as an accessibility tool, providing semantic tagging and navigational aids to ensure documents comply with international accessibility and archival s
Renders custom shapes, gradients, and complex visual elements by embedding SVG content dynamically.
Termtosvg is a command-line tool that records terminal sessions and converts them into standalone SVG animations. It captures the exact timing and output of each command, producing lightweight SVG files that replay the session in any web browser without requiring additional software. The tool supports importing existing asciicast recordings from asciinema, enabling cross-tool compatibility and reuse of previously captured terminal sessions. Users can customize the appearance of their animations by applying user-defined color themes, terminal UI elements, and animation controls through SVG tem
Converts terminal output into SVG frames and sequences them into browser-playable animations.
Misbrands is an SVG satirical logo generator and developer meme asset tool. It functions as a vector graphic sticker tool designed to produce high-resolution images for printing physical stickers for hardware. The project focuses on satirical tech branding by swapping brand names on industry logos. It generates humorous technology stickers and developer humor content centered around industry rivalries and technology stack preferences. The system utilizes a vector-based asset pipeline and SVG template injection to replace text elements within graphics. It employs coordinate-based logo mapping
Produces live SVG DOM elements directly in the browser for real-time logo generation.
Penrose is a compiler that transforms structured mathematical notation into optimized SVG diagrams. It uses a three-stage pipeline of separate domain, substance, and style files to define mathematical objects, relationships, and visual presentation, then solves continuous optimization problems with user-defined spatial constraints and objectives to automatically arrange diagram elements. The system separates diagram content from visual style using distinct declarative languages, and provides a typed domain language with subtype hierarchies for mathematical objects. It supports embedding compi
Converts optimized diagram state into SVG elements for web-based display and interaction.
SVGEdit is a browser-based SVG editor and canvas engine used for creating and modifying scalable vector graphics files. It provides a web interface for vector design and functions as an embeddable editor that can be injected into HTML elements within other web applications. The project allows for the development of custom SVG tools and the construction of bespoke vector graphics editors by utilizing its standalone drawing engine.
Uses the native browser DOM to treat SVG elements as a live scene graph for direct manipulation.
Icones is a client-side icon browser and management tool that lets you search, preview, and download icons from the Iconify ecosystem. It provides instant fuzzy search across thousands of icons from multiple collections, all performed locally in the browser without server round-trips. The tool enables you to filter icons by category, bookmark individual icons or entire collections for later use, and download icons as SVG files. A distinctive capability is the ability to pack selected icons into a custom icon font file, generated on the client side using WebAssembly-based font compilation. Ic
Renders icons as inline SVG elements in the DOM for immediate styling and manipulation.
Logos is a curated collection of optimized SVG logos for developer tools and brands, stored as individual SVG files in a flat directory structure. The collection is manually selected and optimized to ensure quality and consistency, with each logo served as a raw SVG file that browsers and tools can render natively. The collection supports direct file-system access through its flat directory storage, and includes a lightweight index of brand names and file paths for fast keyword-based logo lookup. Logos are delivered as static assets over HTTP, relying on standard web server caching for perfor
Serves raw SVG files that browsers and tools render natively without transformation.
GitHub Profile Trophy is a service that generates SVG images of achievement trophies based on a GitHub user's profile statistics, designed for embedding in README files. It fetches profile data through the GitHub GraphQL API, renders the trophies server-side as SVG markup, and serves them directly to clients, with a Redis-based caching layer to reduce repeated API calls and speed up subsequent requests. The service can be deployed as a self-hosted HTTP server running on the Deno JavaScript runtime, packaged with Docker for consistent local and CI environments. It also offers a GitHub Action w
Generates SVG trophy images from GitHub profile statistics for embedding in README files.
SVGOMG is a browser-based SVG minification tool that applies SVGO transformations entirely on the client side. It processes SVG files in a Web Worker to keep the user interface responsive, then displays the original and optimized file sizes side by side, including gzipped size estimates. The tool provides a live preview of the optimized SVG markup, rendered directly in the browser for immediate visual feedback. Users can configure which SVGO optimization plugins are enabled or disabled, set numerical precision for coordinates and transforms, and optionally pretty-print the output. Multiple op
Renders optimized SVG markup directly in the browser for immediate visual feedback.
Ractive is an open-source JavaScript framework for building reactive user interfaces where the DOM automatically updates when underlying data changes. It is fundamentally a declarative data binding library that synchronizes data between the model and the view, enabling two-way binding without manual DOM manipulation, and operates as a template-based component system for composing markup, styles, and logic into reusable UI components. The framework distinguishes itself through a plugin-extensible architecture that allows custom components, adaptors, and extensions to be registered without modi
Creates and updates SVG elements declaratively within the same reactive component model.
ngx-charts is an Angular charting library and SVG data visualization framework. It provides a set of declarative UI components for rendering animated and interactive charts and graphs within Angular applications. The library allows for the assembly of specialized visualizations by combining low-level internal charting components. It supports the creation of custom charts through the use of mathematical scales, shape generators, and CSS styling overrides. The framework covers a wide range of visualization types, including comparison charts such as bar and line graphs, distribution visualizati
Renders and animates SVG chart elements declaratively within an Angular component model.
Infographic is a declarative SVG infographic engine and AI-powered generator that transforms structured specifications and natural language descriptions into complete visual layouts. At its core, it provides a data storytelling framework that combines AI-driven layout generation with multi-pattern composition, supporting linear, circular, radial, tree, and mirror arrangements for sequential, hierarchical, and comparative data structures. The project distinguishes itself through a canvas-based interactive editor with real-time element manipulation and state history management, alongside a serv
Renders infographics to SVG strings in non-browser environments using a dedicated server-side method.
viz-js is a JavaScript rendering library and graph visualization engine that converts Graphviz DOT language descriptions into visual diagrams. It functions as a Graphviz rendering library designed to produce SVG output for web applications. The project utilizes a WebAssembly port of the Graphviz C library to execute layout engines directly in the browser. To maintain interface responsiveness, it processes computationally expensive layout calculations within background worker threads and uses a standardized JSON format for layout serialization. The library provides tools for dynamic graph vis
Returns rendered diagrams as live SVG DOM elements for direct insertion into web pages.
svg-term-cli is a terminal-to-SVG converter and animated vector graphic generator. It transforms recorded shell session data into scalable vector graphics that use CSS for styling and animation. The tool allows for the application of predefined color profiles and visual themes to match specific styles. It also provides configuration options for window dimensions, padding, and cursor visibility to customize the appearance of the output graphics. The project includes capabilities for recording timeline trimming to render specific segments of a session and supports the conversion of terminal re
Converts recorded terminal interactions into animated SVG sequences for high-quality sharing.
Populates pre-defined SVG templates with structured GitHub user data using string interpolation for card generation.
Moe-Counter is a self-hosted page view tracker that renders visitor counts as dynamically generated SVG badges with anime-themed styling. It operates as a lightweight Node.js HTTP service that associates each unique counter name in a URL with a stored page view count, providing a customizable alternative to third-party analytics services. The service is designed for flexible deployment, running either directly from source with pnpm dependency management or as a pre-built Docker image from GitHub Container Registry. Runtime configuration is handled entirely through environment variables set in
Renders visitor counts as dynamically generated SVG images with anime-themed styling applied through query parameters.
Rough Charts ist eine React-basierte Charting-Bibliothek, die eine Reihe modularer Komponenten für den Aufbau von Datenvisualisierungen bereitstellt. Sie ermöglicht die Erstellung benutzerdefinierter Diagramme und Grafiken durch eine deklarative Syntax, wodurch Entwickler komplexe Layouts durch das Verschachteln einzelner Elemente wie Achsen, Serien und Tooltips zusammenstellen können. Die Bibliothek zeichnet sich dadurch aus, dass sie eine prozedurale, handgezeichnete Ästhetik auf alle gerenderten Grafiken anwendet. Durch die Verwendung randomisierter Offsets zur Erzeugung unregelmäßiger Linienpfade entstehen Visualisierungen, die das Aussehen von Skizzen nachahmen. Dieser Stil wird auf Standard-Diagrammelemente angewendet, um Webberichten einen kreativen und informellen visuellen Ton zu verleihen. Die Bibliothek bewältigt die technischen Anforderungen webbasierter Datendarstellung durch die Verwaltung responsiver Container-Layouts und die Synchronisierung visueller Updates mit zugrunde liegenden Datenänderungen. Sie rendert diese Visualisierungen als Vektorgrafiken direkt innerhalb des Browser-DOM.
Uses a declarative component model to generate and manipulate vector graphics directly within the browser document object model.