18 रिपॉजिटरी
Tooltip components that contain actionable elements or interactive content.
Distinct from Interactive UI Elements: Distinct from Interactive UI Elements: specifically identifies tooltips that act as mini-menus or action containers rather than generic actionable components.
Explore 18 awesome GitHub repositories matching user interface & experience · Interactive Tooltips. Refine with filters or upvote what's useful.
Tippy.js is a JavaScript tooltip library and interactive popup framework used to create tooltips, popovers, and dropdowns. It functions as a floating UI component toolkit that renders content relative to a reference element with support for automatic positioning, flip-positioning, and offsets. The library acts as an accessible overlay manager, using ARIA attributes and focus management to ensure screen reader compatibility. It also serves as a CSS animation tool, providing utilities for transitions, spring physics, and themes to manage the visual entry and exit of floating interface elements.
Provides multiple ways to attach informational popups to elements using CSS selectors, DOM elements, or data attributes.
Carbon is an enterprise design system that provides a comprehensive collection of reusable UI components, design tokens, and guidelines for building professional web applications. It functions as a CSS framework that enforces a unified design language across projects through standardized typography, spacing, and color palettes. The system utilizes a platform-agnostic design token system to maintain visual consistency across different technologies. This includes centralized management of brand colors, motion easing curves, and a curated library of accessible SVG icons. The framework covers a
Provides interactive tooltips that allow users to perform actions directly within the popup content.
Tether is a DOM positioning engine designed to anchor floating user interface elements, such as tooltips and dropdowns, to target elements. It functions as a logic engine for managing the placement of overlays and synchronizing the position of secondary elements relative to primary anchors. The system includes collision detection and overflow prevention to ensure that floating menus and overlays remain within the visible viewport. It automatically repositions elements when they encounter page boundaries to prevent visual clipping. The tool manages dynamic element alignment and tracking durin
Links floating UI elements to targets using specific attachment points and DOM references.
This project is a JavaScript UI component library and frontend utility toolkit. It serves as a web modal framework and popup library, providing a specialized system for rendering interactive dialogs, overlays, and layered interfaces over web page content. The library is distinguished by its comprehensive set of overlay tools, including alert dialogs, confirmation prompts, and the ability to embed external content via iframes. It also features a responsive twelve-column grid system for cross-device layout compatibility and an internal modular dependency management system for on-demand loading
Provides small popup tips that anchor themselves to specific page elements.
XPopup is an Android popup UI framework and overlay component library used to build customizable dialogs, bottom sheets, and overlay views. It serves as a dialog engine for creating high-performance popup views and provides a toolkit for executing entrance and exit transitions. The library is distinguished by its ability to render ultra-long, high-resolution images using memory-efficient loading and drag-to-dismiss interactions. It supports displaying overlay views while an application is in the background through system overlay permissions. The framework covers anchor-based positioning for
Implements mechanisms for linking floating popups to target UI elements or touch points.
Provides interactive tooltips that show data details on hover, with a static SVG fallback.
Cobe is a WebGL globe library designed for interactive 3D geographic data visualization. It functions as a canvas-based map component that renders a world map, allowing for the plotting of latitude and longitude coordinates via markers and connecting arcs. The library distinguishes itself by linking standard HTML elements to 3D coordinates using CSS anchor positioning. This integration enables the attachment of DOM elements, such as labels and tooltips, directly to markers and arcs on the sphere. The system covers geographic data plotting and network connection mapping, utilizing automated r
Links HTML labels and tooltips to 3D markers using CSS anchor positioning.
Codehike is a React-based documentation framework and interactive code walkthrough tool. It functions as a markdown content orchestrator that transforms decorated markdown into structured data and React components, serving as a visualization layer for highlighting code ranges, diffs, and compiler errors. The project is distinguished by its ability to create scrollycoding experiences and step-by-step technical tutorials. It features token-level animations that visually demonstrate how logic evolves between code versions and provides a system for syncing UI state to the browser scroll position.
Displays interactive popovers containing rich content when hovering over specific code tokens.
balloon.css is a lightweight, CSS-driven framework for implementing customizable tooltips and textual overlays. It is a pure CSS library that enables the creation of informative pop-up elements without requiring a JavaScript runtime. The framework uses CSS variables to allow for the customization of colors, fonts, and animations. Tooltips can be positioned in specific directions relative to their trigger element and support the embedding of rich content, such as HTML special characters and icon fonts. Visibility is primarily managed through hover triggers, though the system supports programm
Displays small informational popups anchored to elements when a user hovers over them.
TagSpaces is an offline-first file tagging and organization platform that lets you manage local files with portable metadata stored directly in filenames or sidecar JSON files, eliminating the need for a central database. It functions as a full-text file search engine, a Kanban board file organizer, a local AI file assistant, an S3-compatible cloud file manager, and a web clipper and bookmark manager, all within a single application. The project distinguishes itself through a local-first architecture where all file operations, indexing, and AI processing run entirely on the device, with cloud
Provides an interactive tooltip in the search bar for guided query composition.
Hopscotch is a JavaScript library and framework for creating interactive product tours and user onboarding guides. It serves as a tool for building step-by-step instructional walkthroughs that highlight specific page elements and display contextual tooltips to help users navigate web application interfaces. The library functions as a tooltip orchestrator that anchors instructional bubbles to HTML elements by calculating their position within the browser viewport. It supports the creation of branded tours through the use of custom stylesheets and markup templates for visual customization. The
Anchors instructional bubbles to specific HTML elements by calculating their position in the browser viewport.
यह React एप्लिकेशन्स के लिए एक गाइडेड टूर लाइब्रेरी और ऑनबोर्डिंग फ्रेमवर्क है। यह विशिष्ट इंटरफेस कंपोनेंट्स को हाइलाइट करने के लिए एलिमेंट-एंकर पॉपओवर और विज़ुअल मास्किंग टूल्स का उपयोग करके इंटरैक्टिव, स्टेप-बाय-स्टेप वॉकथ्रू बनाने के लिए एक सिस्टम प्रदान करता है। यह लाइब्रेरी एक्सेसिबिलिटी पर केंद्रित है, जो समावेशी उपयोगकर्ता ऑनबोर्डिंग सुनिश्चित करने के लिए स्क्रीन रीडर्स और कीबोर्ड नेविगेशन के लिए इन-बिल्ट समर्थन प्रदान करती है। यह डिफ़ॉल्ट इंटरफेस तत्वों, जैसे बैज और बटन, को कस्टम React कंपोनेंट्स के साथ बदलने की अनुमति देकर व्यापक अनुकूलन की सुविधा देती है। यह फ्रेमवर्क स्टेट मैनेजमेंट और सेलेक्टर-आधारित एलिमेंट टारगेटिंग के माध्यम से टूर ऑर्केस्ट्रेशन को कवर करता है। इसमें स्वचालित व्यूपोर्ट स्क्रॉलिंग, पॉपओवर ट्रांज़िशन प्रबंधन और वॉकथ्रू के दौरान अंतर्निहित इंटरफेस के साथ उपयोगकर्ता इंटरैक्शन को प्रतिबंधित करने की क्षमता शामिल है।
Displays floating information panels anchored to specific interface elements to provide on-demand user guidance.
This project is a React tooltip component and CSS-driven library used to display descriptive text bubbles when users hover over or focus on specific elements. It functions as an accessible UI widget and customizable framework for managing informational popovers within React applications. The library distinguishes itself through flexible anchor management, allowing a single tooltip instance to be linked to multiple trigger elements via CSS selectors or HTML data attribute binding. It provides specific controls for visibility timing and animation, as well as the ability to disable automatic sty
Places tooltips relative to anchor elements using predefined directions and custom offsets.
Ace is a responsive admin template and UI component library built on Bootstrap 3. It provides a comprehensive framework for creating administrative dashboards with a grid-based layout system that adapts to various screen sizes. The project features a broad array of pre-styled layouts for administrative interfaces, including specialized page templates for user profiles, email clients, and real-time chat interfaces. It includes a configuration system for adjusting visual presentations through color skins and right-to-left mirroring support. The library covers a wide range of interface capabili
Provides tooltip components that contain actionable elements or interactive content with animations.
Makie.jl is a high-performance Julia data visualization library and hardware-accelerated plotting engine used to create interactive 2D and 3D visualizations. It functions as a reactive visualization framework where plots update automatically via observables and compute graphs, and as a vector graphics generator for high-resolution academic output. The system is distinguished by its backend-agnostic rendering pipeline, which supports OpenGL, WebGL, and ray-traced scenes. It employs a grammar-of-graphics approach to map variables to aesthetic attributes and utilizes a hierarchical scene graph t
Generates interactive data inspector tooltips that function as DOM elements within a web browser.
Unovis is a modular SVG and Canvas data visualization library used to build interactive charts, maps, and network graphs. It provides a framework-agnostic set of primitives for creating data dashboards and specialized visualizations. The library is distinguished by its dedicated toolkits for different visualization domains, including an XY charting library for coordinated plots, a network graph framework for relational data, and a geospatial visualization toolkit for TopoJSON-based mapping. Its capability surface covers a wide range of data representations, including linear, area, and bar ch
Ships interactive tooltip components that display custom text content tied to a crosshair cursor.
This project is a comprehensive design system framework and component library built for React. It provides a suite of modular, accessible, and themeable interface elements designed to maintain a unified visual language and brand alignment across complex web applications. By encapsulating interaction logic and styling within individual components, it enables developers to build consistent, responsive interfaces through declarative composition. The library distinguishes itself by prioritizing inclusive user experiences through built-in accessibility management, including standardized keyboard n
Renders floating labels that appear upon interaction to provide additional information or guidance without cluttering the view.
This project is a real-time strategy game framework built for the Godot engine, providing a foundational template for developing isometric strategy titles. It offers a collection of reusable systems designed to accelerate the creation of competitive games, including support for both human and artificial intelligence participants. The framework distinguishes itself through a comprehensive suite of core mechanics tailored for the real-time strategy genre. It includes a dedicated fog-of-war system that obscures map regions based on unit line-of-sight, alongside isometric pathfinding and navigati
Implements contextual UI tooltips that display descriptive information about resources and production tasks during player interaction.