GetEles is a browser extension for front-end developers. It allows you to get page info, fetch web resources, inspect DOM structure and element details, convert to Tailwind CSS, and measure element distance.
Features
Get Page Info
Retrieve essential information about the current web page, such as title, meta description, and keywords.
Fetch Web Resources
Access and list all web resources used on a page, including scripts, styles, and media files.
Inspect DOM Structure
Explore and analyze the Document Object Model (DOM) structure of a web page for better understanding and debugging.
Inspect Element Details
Examine specific elements on a web page to see their styles, attributes, and properties.
Convert to Tailwind CSS
Automatically convert CSS to Tailwind CSS classes to streamline styling processes.
Measure Element Distance
Calculate the distance between elements on a web page to assist with layout and design tasks.
Prefix Customization
Allows users to input a custom prefix for the Tailwind color classes, enhancing customization and organization of styles.
Format Selection
Enables users to choose the color format (e.g., RGB), allowing for flexibility in how colors are output and integrated into design projects.
Opacity Control
Provides a slider to adjust the opacity of the colors, aiding in designing with transparency directly on the interface.
Class Search
Allows users to input and search for particular Tailwind CSS classes by name, making it easier to find and apply styles quickly.
Class Details Display
Shows detailed CSS information about a selected Tailwind CSS class, helping users understand how each class affects the styling of their elements.
Preview Pane
Provides a preview of how the selected Tailwind CSS classes will affect a Box or Text element, enabling users to visually test styles in real time.
Matched Classes List
Displays a list of matched Tailwind CSS classes based on the user’s input, allowing for quick selection and application of styles.
Git Command Cheatsheet
Provides a comprehensive guide to various Git commands. Users can select different commands to view details and scenarios where they can be applied, helping them understand and apply Git commands effectively.
Interactive Git Command Records
Allows users to select and view records of different combinations of Git commands. This feature helps users track their command usage and understand how different commands work together.