Style Sheet (QSS) support to PyCharm and other IntelliJ-based IDEs. Never switch between your IDE and external editors again when working with QSS files.
QSS.Toolkit.Demo.2.mp4
- Rich Highlighting - Specialized coloring for Qt selectors, properties, values, and comments
- Selector Recognition - Full support for complex selectors including pseudo-elements (
::item) and pseudo-states (:hover) - Color Preview - Inline visualization of color values in your code
- In-Editor Color Picker - Click on color swatches in the gutter to select colors visually
- Real-Time Updates - Automatically updates hex values when you select new colors
- Instant Visual Feedback - See your colors directly in the editor gutter
- Widget Suggestions - Quick access to Qt widget selectors (QPushButton, QMainWindow, etc.)
- Property Completion - Auto-completion for all standard QSS properties with descriptions
- Context-Aware Values - Suggests appropriate values based on the property context
- Pseudo-States - Complete list of available pseudo-states and pseudo-elements
- Project-Wide Palettes - Create and manage color schemes for consistent styling
- Easy Color Access - Copy color values directly to your clipboard
- Visual Organization - View all your project colors in one dedicated tool window
- Persistent Storage - Palettes are saved with your project
- Hierarchical View - See your entire QSS file structure organized by selectors
- Quick Navigation - Jump directly to any selector or property with one click
- Rule Visualization - Understand the structure of complex stylesheets at a glance
- Selective Focus - Collapse complex rule blocks to focus on relevant sections
- Comment Folding - Hide large comment blocks when not needed
- Improved Readability - Reduce visual clutter in large stylesheets
- Open PyCharm
- Go to Settings/Preferences → Plugins
- Select "Marketplace" tab
- Search for "QSS Toolkit"
- Click "Install"
- Restart PyCharm when prompted
- Download the latest plugin release (.zip file) from the Releases page
- Open PyCharm
- Go to Settings/Preferences → Plugins
- Click the gear icon and select "Install Plugin from Disk..."
- Navigate to the downloaded .zip file and select it
- Restart PyCharm when prompted
- Create or open any file with a
.qssextension - Syntax highlighting and code completion will be automatically available
- The plugin requires no configuration - it works immediately upon installation
- Look for color swatches in the gutter next to hex color values (e.g.,
#FF5500) - Click on a swatch to open the color picker dialog
- Select your desired color using the visual picker or by entering values
- Click OK to automatically update the hex value in your code
- Open the QSS Colors tool window (View → Tool Windows → QSS Colors)
- Click "Add Palette" to create a new color collection
- With a palette selected, click "Add Color" to choose colors
- Name your colors (optional) for better organization
- Use right-click or keyboard shortcuts to copy color values to clipboard
- Double-click on a color to quickly copy its hex value
- Open the Structure tool window (View → Tool Windows → Structure, or Alt+7)
- Browse the hierarchical view of selectors and properties
- Click on any item to navigate directly to that part of your QSS file
- Use the "-" icons in the gutter to collapse rule blocks or comments
- Press Ctrl+Shift+NumPad- to collapse all blocks in the file
- Press Ctrl+NumPad+ to expand a collapsed block
This project is licensed under the Apache License 2.0 - see the LICENSE file for details.
- GitHub: https://github.com/avaxerrr
- Email: zonemaxq@gmail.com
QSS Toolkit is not affiliated with JetBrains or Qt. PyCharm is a trademark of JetBrains s.r.o. Qt is a trademark of The Qt Company Ltd.