{"id":13415422,"url":"https://github.com/hustlei/QssStylesheetEditor","last_synced_at":"2025-03-14T22:33:31.058Z","repository":{"id":38816082,"uuid":"167522695","full_name":"hustlei/QssStylesheetEditor","owner":"hustlei","description":"Editor for qt stylesheet (qss).  Real-time preview, and user can define varibles in qss.","archived":false,"fork":false,"pushed_at":"2023-09-10T01:35:33.000Z","size":4706,"stargazers_count":1307,"open_issues_count":52,"forks_count":254,"subscribers_count":21,"default_branch":"master","last_synced_at":"2024-10-29T17:27:23.587Z","etag":null,"topics":["editor","qss","qsseditor","qssmate","qssstylesheeteditor","qt","skin","stylesheet"],"latest_commit_sha":null,"homepage":"","language":"Python","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hustlei.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":"hustlei","issuehunt":null,"otechie":null,"custom":["https://paypal.me/hustlei","https://hustlei.github.io/software/QssStylesheetEditor/sponsor/weixin_alipay.png"]}},"created_at":"2019-01-25T09:37:11.000Z","updated_at":"2024-10-28T05:06:32.000Z","dependencies_parsed_at":"2023-01-25T16:46:03.931Z","dependency_job_id":"07c738a8-a99f-43de-86b7-06e4ae15119f","html_url":"https://github.com/hustlei/QssStylesheetEditor","commit_stats":null,"previous_names":[],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustlei%2FQssStylesheetEditor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustlei%2FQssStylesheetEditor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustlei%2FQssStylesheetEditor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hustlei%2FQssStylesheetEditor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hustlei","download_url":"https://codeload.github.com/hustlei/QssStylesheetEditor/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242640907,"owners_count":20162054,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["editor","qss","qsseditor","qssmate","qssstylesheeteditor","qt","skin","stylesheet"],"created_at":"2024-07-30T21:00:48.560Z","updated_at":"2025-03-14T22:33:31.052Z","avatar_url":"https://github.com/hustlei.png","language":"Python","funding_links":["https://liberapay.com/hustlei","https://paypal.me/hustlei","https://hustlei.github.io/software/QssStylesheetEditor/sponsor/weixin_alipay.png"],"categories":["editor"],"sub_categories":[],"readme":"English | [简体中文](readme_zh-CN.md)\n\n# QssStylesheetEditor\n\n[![Build Status](https://api.travis-ci.com/hustlei/QssStylesheetEditor.svg?branch=master)](https://travis-ci.com/hustlei/QssStylesheetEditor)\n[![Codacy Badge](https://api.codacy.com/project/badge/Grade/220d511b3ab146d0b03fef0245e00525)](https://www.codacy.com/manual/hustlei/QssStylesheetEditor?utm_source=github.com\u0026amp;utm_medium=referral\u0026amp;utm_content=hustlei/QssStylesheetEditor\u0026amp;utm_campaign=Badge_Grade)\n[![Coverage Status](https://coveralls.io/repos/github/hustlei/QssStylesheetEditor/badge.svg?branch=master)](https://coveralls.io/github/hustlei/QssStylesheetEditor?branch=master)\n[\u003cimg alt=\"Platform:win|osx|linux\" src=\"https://raw.githubusercontent.com/hustlei/QssStylesheetEditor/master/docs/assets/badge/platform.svg?sanitize=true\" onerror=\"this.src='https://hustlei.github.io/assets/badge/platform.svg';this.onerror=null\" /\u003e](https://travis-ci.com/hustlei/QssStylesheetEditor)\n\n\u003cbr\u003e\n\nQssStylesheetEditor is a powerful qt stylesheet(QSS) editor.\nReal-time preview, automatically completion, and user can define custom variables,\npreview custom ui code, using QPalette etc.\n\n\n# screenshot\n\n![GUI(v1.7) screeshot](https://hustlei.github.io/software/QssStylesheetEditor/screenshot/en/QssStylesheetEditor_v1.7.png  \"GUI(v1.7)\")\n\n# Features\n\n+ Qss code highlight and code folding\n+ Automatic completion\n+ In-time preview, Almost all of the qtwidgets can be previewed\n+ Custom ui code preview\n+ Customize variables and reference in Qss\n+ Change variable color through color dialog box\n+ Reference image by relative path or in resource files\n+ Reference QPalette, and change QPalette via color dialog box\n+ Switch different system themes (xp, vista etc.)\n+ Internationalization\n  + Now English Chainese and Russian translations are available\n\n# Platform\n\n+ Windows (maybe won't run on xp)\n+ macOS\n+ Linux\n+ UNIX\n\n\n# Usage\n\nFollow the steps as below, or install the binary installation package:\n\n1. download [QssStylesheetEditor-1.7-py3-none-any.whl](https://github.com/hustlei/QssStylesheetEditor/releases)\n2. run `pip install QssStylesheetEditor-1.7-py3-none-any.whl` install QssStylesheetEditor\n3. run `qsseditor` or `QssStylesheetEditor` the app will start\n\nIf you are windows 64bit user, binary package and installer is available now.\n\n+ [QssStylesheetEditor1.7_win64_installer.exe](https://github.com/hustlei/QssStylesheetEditor/releases)\n+ QssStylesheetEditor1.7_win64_portable.7z [[Download]](https://pan.baidu.com/s/1T0zzM4Y6h1SwHBsliEUbTQ) (security code: 65kn)\n\n\n\u003e Alternatively, manually install the package is ok too\n\u003e \n\u003e\u003e 1. install python3: following \u003chttp://python.org/\u003e\n\u003e\u003e 2. install dependencies:\n\u003e\u003e     - preimport: `pip install preimport`\n\u003e\u003e     - tomlconfig: `pip install tomlconfig`\n\u003e\u003e     - CodeEditor: `pip install CodeEditor`\n\u003e\u003e     - requests: `pip install requests`\n\u003e\u003e 3. download and unzip package:\n\u003e\u003e     + download [QssStylesheetEditor_v1.7.zip](https://github.com/hustlei/QssStylesheetEditor/releases)\n\u003e\u003e     + unzip and change dir to QssStylesheetEditor_v1.7 `cd QssStylesheetEditor_v1.7`\n\u003e\u003e 4. Run QssStylesheetEditor:\n\u003e\u003e     + double click qsseditor.pyw\n\u003e\u003e     + or run `python qsseditor.pyw`\n\n\n# Using custom variable \n\nIn QssStylesheetEditor, users can define and use custom variables in QSS. \n\nUsing following statement to define new variable:\n\n~~~js\n/*example of custom variable definition*/\n$background = #fff;  /* define var with name \"background\" */\n$border = red; /* define var with name \"border\" */\n$text     = rgb(10,10,10);\n~~~\n\n\u003e A variable definition end with a \";\".\n\nReference defined variable as following:\n\n~~~css\n/* example of custom variable reference */\nQWidget\n{\n    color: $text; /* reference variable text*/\n    background-color: $background; /* reference variable background*/\n}\n~~~\n\n\nUsers can export the code to qss file without vars by the \"File\u003eExport\" menu.\n\n\n**Variable Color pick dialog**\n\nWhen a variable is defined in QssStylesheetEditor, the variable will be automatically displayed in the color pannel. You can click the color button to select the variable color through the color pick-up box.\n\n\u003cimg src=\"https://raw.githubusercontent.com/hustlei/QssStylesheetEditor/master/docs/assets/screenshot/ColorDlg_v1.3.png\" style=\"max-height:480px;max-width:960px\"/\u003e\n\n\u003e If an undefined variable is referenced, it will be automatically recognized and displayed in the color panel too. \n\n# Image reference path\n\nWhen images are use in the qss code, if the url is relative,  QssStylesheetEditor will find the image file in the folder where the qss code file is.\n\n~~~css\nbackground-image: url(\"img/close.png\");\n/* the img folder must be in the same directory of the qss code file*/\n~~~\n\n\n## image in resource file\n\nIf your image files is converted to resource file by pyrcc5(pyrcc5 xxx.qrc -o xxxresource.py).\n\nYou can reference images in the resource file as following:\n\n~~~css\nbackground-image: url(\":/img/close.png\");\n~~~\n\nQssStylesheetEditor will search the resource file filename.py(filename must be same of qss file) in the directory of the currently opened qss stylesheet code file and loads it automatically.\n\n# QPalette reference\n\nIn QssStylesheetEditor, users can use QPalette as follow：\n\n~~~\ncolor: palette(Text);\nbackground-color: palette(Window);\n~~~\n\nChanging color of QPalette is supported via pick-up color in palettdialog.\nAnd the new QPalette code can be viewed via click the \"ViewPaletteCode\" button.\n\n\u003cimg src=\"https://hustlei.github.io/software/QssStylesheetEditor/screenshot/PaletteDlg_V1.7.png\" style=\"max-height:480px;max-width:960px\" /\u003e\n\n\u003e The reset button in PaletteDialogreset could cancel QPalette modification.\n\n# custom ui code preview\n\nIn the  editor of 'Custom' tab of preview widget, user can input custom ui code, like follow:\n\n~~~\nclass MainWindow(QWidget):\n    def __init__(self):\n        super().__init__()\n~~~\n\nand then press 'Preview' button to preview the qss.\n\n\u003e 'MainWindow' must be defined in the custom code.\n\n\u003cimg src=\"https://hustlei.github.io/software/QssStylesheetEditor/screenshot/CustomPreview_v1.7.png\" style=\"max-height:480px;max-width:960px\" /\u003e\n\n# screenshot\n\n\u003cdiv\u003e\u003cspan\u003e\u003cb\u003eAutoComplete\u003c/b\u003e\u003c/span\u003e\u003c/div\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/hustlei/QssStylesheetEditor/master/docs/assets/screenshot/AutoComplete.png\" alt=\"AutoComplete\" style=\"max-height:480px;max-width:960px\"/\u003e\n\n\u003cdiv\u003e\u003cspan\u003e\u003cb\u003eQssStylesheetEditor on macOS\u003c/b\u003e\u003c/span\u003e\u003c/div\u003e\n    \u003cimg src=\"https://hustlei.github.io/software/QssStylesheetEditor/screenshot/en/QssStylesheetEditor_mac_v1.5.png\" alt=\"Gui on macOS\" style=\"max-height:480px;max-width:960px\"/\u003e\n\n\u003cdiv\u003e\u003cspan\u003e\u003cb\u003eQssStylesheetEditor GUI V1.2\u003c/b\u003e\u003c/span\u003e\u003c/div\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/hustlei/QssStylesheetEditor/master/docs/assets/screenshot/QssStylesheetEditor_v1.2.png\" alt=\"v1.2\" style=\"max-height:480px;max-width:960px\"/\u003e\n\u003cdiv\u003e\u003cspan\u003e\u003cb\u003eQssStylesheetEditor GUI V1.0\u003c/b\u003e\u003c/span\u003e\u003c/div\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/hustlei/QssStylesheetEditor/master/docs/assets/screenshot/QssStylesheetEditor_v1.0.png\" alt=\"v1.0\" style=\"max-height:480px;max-width:960px\"/\u003e\n\n\n# License\nYou can use this software for free in open source projects that are licensed under the GPL. but there is an exception: if you only use it to generate qss file for commercial product, the product's source code can be shipped with whatever license you want.\n\nIf you don't want to open your code up to the public, you can purchase a commercial license for USD 100 per developer, and also should purchase a commercial license for PyQt5.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhustlei%2FQssStylesheetEditor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhustlei%2FQssStylesheetEditor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhustlei%2FQssStylesheetEditor/lists"}