18 repository-uri
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 este un framework de documentație bazat pe React și un instrument interactiv pentru walkthrough-uri de cod. Acesta funcționează ca un orchestrator de conținut markdown care transformă markdown-ul decorat în date structurate și componente React, servind drept strat de vizualizare pentru evidențierea secțiunilor de cod, a diferențelor (diffs) și a erorilor de compilare. Proiectul se distinge prin capacitatea de a crea experiențe de tip "scrollycoding" și tutoriale tehnice pas cu pas. Dispune de animații la nivel de token care demonstrează vizual modul în care logica evoluează între versiunile de cod și oferă un sistem pentru sincronizarea stării UI cu poziția de scroll a browserului. Framework-ul acoperă o gamă largă de capacități de vizualizare, inclusiv crearea de slideshow-uri de cod, layout-uri de tip spotlight și blocuri de cod cu tab-uri. Suportă adnotarea detaliată a codului prin tooltips, callout-uri și note de subsol, precum și utilitare funcționale precum switchere de limbaj, transpilarea codului și integrarea datelor de compilare în timp real. Sistemul utilizează validarea bazată pe schemă pentru a asigura siguranța tipurilor și consistența datelor structurate extrase din fișierele markdown.
Displays interactive popovers containing rich content when hovering over specific code tokens.
balloon.css este un framework ușor, bazat pe CSS, pentru implementarea de tooltips și overlay-uri textuale personalizabile. Este o bibliotecă pur CSS care permite crearea de elemente pop-up informative fără a necesita un runtime JavaScript. Framework-ul folosește variabile CSS pentru a permite personalizarea culorilor, fonturilor și animațiilor. Tooltip-urile pot fi poziționate în direcții specifice față de elementul declanșator și suportă inserarea de conținut bogat, cum ar fi caractere speciale HTML și icon fonts. Vizibilitatea este gestionată în principal prin declanșatoare de tip hover, deși sistemul suportă vizibilitatea programatică prin comutarea unor atribute HTML specifice. Motorul de randurare utilizează poziționarea absolută și pseudo-elemente pentru a afișa conținutul în funcție de interacțiunea utilizatorului sau de stările definite.
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 este o bibliotecă și un framework JavaScript pentru crearea de tururi interactive de produs și ghiduri de onboarding pentru utilizatori. Servește drept instrument pentru construirea de walkthrough-uri instrucționale pas cu pas care evidențiază elemente specifice ale paginii și afișează tooltips contextuale pentru a ajuta utilizatorii să navigheze în interfețele aplicațiilor web. Biblioteca funcționează ca un orchestrator de tooltips care ancorează bulele instrucționale de elementele HTML prin calcularea poziției lor în viewport-ul browserului. Suportă crearea de tururi branduite prin utilizarea de foi de stil personalizate și template-uri de markup pentru personalizare vizuală. Framework-ul include capabilități pentru gestionarea secvențelor și integrarea evenimentelor, permițând dezvoltatorilor să declanșeze callback-uri JavaScript personalizate în timpul tranzițiilor turului pentru a sincroniza ghidul cu schimbările de stare ale aplicației.
Anchors instructional bubbles to specific HTML elements by calculating their position in the browser viewport.
This is a guided tour library and onboarding framework for React applications. It provides a system for creating interactive, step-by-step walkthroughs using element-anchored popovers and visual masking tools to highlight specific interface components. The library focuses on accessibility, providing built-in support for screen readers and keyboard navigation to ensure inclusive user onboarding. It allows for extensive customization by enabling the replacement of default interface elements, such as badges and buttons, with custom React components. The framework covers tour orchestration throu
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.