5 Repos
Achieves all interactive effects (hover, focus, accordion) purely with CSS without any JavaScript.
Distinct from Pure JavaScript Implementations: Distinct from Pure JavaScript Implementations: focuses on CSS-only interactivity rather than JavaScript-based implementations.
Explore 5 awesome GitHub repositories matching programming languages & runtimes · CSS-Only Interactive Effects. Refine with filters or upvote what's useful.
This project is a curated collection of galleries and component libraries that demonstrate pure CSS visual effects, 3D transforms, animation patterns, and layout solutions. It serves as a visual catalog of interactive UI elements and graphics built exclusively with HTML and CSS. The collection distinguishes itself by implementing complex interactivity, such as state management and animation triggers, using only CSS pseudo-classes and keyframes without any JavaScript. It also features a system for generative art and algorithmic patterns, as well as spatial 3D constructions using perspective an
Achieves complex interactivity and state management purely with CSS, eliminating the need for JavaScript.
CSSFX is a curated collection of pre-made visual CSS effects for buttons, inputs, and other common UI elements. The library is entirely CSS-only, meaning the effects themselves require no JavaScript runtime, and each style can be copied to the system clipboard with a single click using the modern Clipboard API. The project is built as a single-page application with a component-based architecture, yet it delivers its entire interface without external JavaScript frameworks. All effect previews and code snippets are pre-rendered into static HTML files at build time, so each page request requires
Ships a curated collection of pre-made visual CSS effects for buttons and inputs.
simple.css is a classless CSS framework that styles plain, semantic HTML with sensible defaults, requiring no CSS classes or JavaScript. It automatically applies a dark color scheme based on system preference, sets responsive typography and spacing from a modular scale, and includes a minimal CSS reset to normalize browser defaults. The entire framework lives in a single file with no dependencies. The framework uses only element selectors, so any standard HTML page becomes visually presentable with a centered, max-width layout, accessible interactive elements (buttons, forms, navigation), and
Achieves all interactive effects (hover, focus, accordion) purely with CSS without any JavaScript.
hugo-book ist ein Dokumentations-Theme und Framework für statische Websites für Hugo, das darauf ausgelegt ist, strukturierte technische Handbücher, Dokumentationsbücher und mehrsprachige Wissensdatenbanken zu erstellen. Es transformiert Verzeichnisstrukturen in hierarchische Navigationsmenüs und formatierte technische Inhalte. Das Framework enthält einen spezialisierten OpenAPI-Dokumentations-Renderer, der Spezifikationen in strukturierte Referenzseiten konvertiert. Es bietet zudem eine clientseitige Volltextsuche-Integration und unterstützt mehrsprachige Inhalte mit Right-to-Left-Layout-Spiegelung. Das Projekt deckt eine breite Palette an Content-Rendering-Funktionen ab, einschließlich mathematischem Formelsatz, Diagrammgenerierung, Terminal-Recording-Integration und interaktiven Elementen wie Tabbed-Panels und einklappbaren Blöcken. Es integriert zudem ein chronologisches Blog-System und Tools zur Generierung von Inhaltsverzeichnissen und Stepper-Listen. Die visuelle Anpassung erfolgt über Farbschema-Unterstützung, CSS-Style-Overrides und benutzerdefinierte HTML-Injektion.
Implements interactive documentation patterns, such as accordions and tabs, using pure CSS to eliminate JavaScript dependencies.
new.css ist ein klassenloses CSS-Framework, das semantische HTML-Elemente automatisch stylt. Es bietet ein modernes visuelles Design für Websites durch die Anwendung von Regeln direkt auf Standard-HTML-Tags, wodurch die Notwendigkeit für manuelle Klassennamen-Zuweisungen entfällt. Das Projekt enthält eine CSS-Theme-Engine und vordefinierte ästhetische Skins, wie einen kontrastreichen Dark-Mode und eine Oberfläche im Terminal-Stil mit Monospace-Schriftarten und Farbschemata im Command-Line-Stil. Diese visuellen Identitäten werden über CSS-Variablen verwaltet, was die Anpassung der Palette und den Wechsel zwischen Themes ermöglicht. Das Framework deckt eine Reihe visueller Funktionen ab, einschließlich responsiver, flüssiger Typografie und technischer Textformatierung für Codeblöcke und Tastatureingaben. Es bietet zudem Styling für interaktive Disclosure-Widgets, um aufklappbare Inhaltsbereiche ohne die Verwendung von JavaScript zu erstellen.
Creates interactive components like toggleable sections purely with CSS and HTML disclosure elements.