{"id":27714743,"url":"https://github.com/suresh-pyhobbyist/csswriteless","last_synced_at":"2026-03-09T14:06:24.563Z","repository":{"id":289015069,"uuid":"969863908","full_name":"Suresh-pyhobbyist/csswriteless","owner":"Suresh-pyhobbyist","description":"Use csswriteless to write minimal shorthand that expands into full CSS","archived":false,"fork":false,"pushed_at":"2025-05-24T06:20:24.000Z","size":75,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-09-18T05:26:52.801Z","etag":null,"topics":["cli","cli-app","css","css-animations","css3","cssframework","javascript","javascript-package","npm","npm-package"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Suresh-pyhobbyist.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-04-21T04:05:53.000Z","updated_at":"2025-05-24T06:20:28.000Z","dependencies_parsed_at":"2025-07-09T13:48:02.967Z","dependency_job_id":"48ed7b38-0635-442d-be0f-bf605c0a9db1","html_url":"https://github.com/Suresh-pyhobbyist/csswriteless","commit_stats":null,"previous_names":["suresh-pyhobbyist/csswriteless"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Suresh-pyhobbyist/csswriteless","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Suresh-pyhobbyist%2Fcsswriteless","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Suresh-pyhobbyist%2Fcsswriteless/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Suresh-pyhobbyist%2Fcsswriteless/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Suresh-pyhobbyist%2Fcsswriteless/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Suresh-pyhobbyist","download_url":"https://codeload.github.com/Suresh-pyhobbyist/csswriteless/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Suresh-pyhobbyist%2Fcsswriteless/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278830105,"owners_count":26053234,"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","status":"online","status_checked_at":"2025-10-07T02:00:06.786Z","response_time":59,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["cli","cli-app","css","css-animations","css3","cssframework","javascript","javascript-package","npm","npm-package"],"created_at":"2025-04-27T00:54:45.557Z","updated_at":"2025-10-07T19:12:11.178Z","avatar_url":"https://github.com/Suresh-pyhobbyist.png","language":"JavaScript","readme":"![Group 12](https://github.com/user-attachments/assets/169d4754-aff7-40e4-89d1-b06c35b2914c)\n\n\ncsswriteless.\nStop bloating your code. Use csswriteless to write minimal shorthand that expands into full CSS. Enjoy clean, readable styles while writing way less code.\n\n**Note: Visit my GitHub page for more information.**\n\n\n## Demo\n\nhttps://github.com/user-attachments/assets/5580a545-2586-41fc-851d-55941b3b57af\n\n## This is How csswriteless Works!\n\n```\ninput.css\n.example_1 {\n  tp: 10px;\n  bttm: 20px;\n}\n```\n---\n```\noutput.css\n.example_1 {\n  top: 10px;\n  bottom: 20px;\n}\n```\n\n**Note: Visit my GitHub page for more information.**\n```\n\n\n## Features ✨\n\n- **Conversion:**  \n  Converts `wd` ➜ `width`, `ht` ➜ `height`, etc. 🚀\n- **Auto-Fix:**  \n  Corrects typos like `border-righeight` ➜ `border-right-width`. 👍\n- **Validation:**  \n  Checks for balanced braces and flags unknown properties. ✅\n- **Formatting:**  \n  Minifies or prettifies your CSS output. 🔧\n- **Watch Mode:**  \n  Reprocesses files on change. 👀\n\nExperimental Features\n--------------------------------------------------------------------------\n- **Batch Processing ⚠️**\n- Works on individual files or whole directories. 📁**\n- **Git Hook:**  \n- Sets up a sample pre-commit hook. 🔨\n```\n\n## 📦 Installation\nInstall globally using npm:\n```bash\nnpm install -g csswriteless\n\n```\n[![NPM](https://nodei.co/npm/csswriteless.png?compact=true)](https://nodei.co/npm/csswriteless/)\n---\n\n\n## Advantages\n```\n🚀 Boost Productivity\n⏳ Save Time\n🖥️ Effortless Coding\n⚡ Write Less, Focus More\n\n\"Just imagine writing more than 10,000 CSS codes and spending countless hours.\nUsing my npm package, you can reduce your workload and save valuable time.\"\n```\n## 🛠️ Usage\n\n### Basic Command\n```bash\ncsswriteless -i input.css -o output.css --fix\n```\n\n| Option                        | Alias  | Description                                                                  | Default       |\n|-------------------------------|--------|------------------------------------------------------------------------------|---------------|\n| `--input \u003cinputFile\u003e`         | `-i`   | Path to the input CSS file                                                   |               |\n| `--directory \u003cdirectoryPath\u003e` | `-d`   | Process a directory of CSS/HTML/JSX/Vue files for batch conversion             |               |\n| `--output \u003coutputFile\u003e`       | `-o`   | Output file path (if omitted, prints to stdout)                              |               |\n| `--watch`                     | `-w`   | Watch file or directory changes and auto-convert                             |               |\n| `--config \u003cconfigFile\u003e`       | `-c`   | Custom configuration file path                                               | `config.json` |\n| `--verbose`                   | `-v`   | Enable verbose logging                                                       |               |\n| `--minify`                    |        | Minify the output CSS                                                        |               |\n| `--pretty`                    |        | Prettify (beautify) the output CSS                                           |               |\n| `--format \u003cformat\u003e`           |        | Output format: `css`, `json`, `scss`, or `less`                               | `css`         |\n| `--fix`                       |        | Auto-fix common CSS mistakes (linting and corrections)                       |               |\n| `--git-hook`                  |        | Set up a sample Git pre-commit hook for CSS conversion automation              |               |\n\n\n**Note: Visit my GitHub page for more information.**\n\n**CSS Shorthand Quick Learn Sheets / for more info - see my github repo**\n\n```markdown\n| CSS Property                     | Abbreviation       |\n|----------------------------------|--------------------|\n| align-content                    | aln-ctnt           |\n| align-items                      | aln-itms           |\n| align-self                       | aln-slf            |\n| animation                        | anim               |\n| animation-delay                  | anim-dly           |\n| animation-direction              | anim-dir           |\n| animation-duration               | anim-dur           |\n| animation-fill-mode              | anim-flm           |\n| animation-iteration-count        | anim-icnt          |\n| animation-name                   | anim-nm            |\n| animation-play-state             | anim-ps            |\n| animation-timing-function        | anim-tmf           |\n| backface-visibility              | bckf-vis           |\n| background                       | bg                 |\n| background-attachment            | bg-atch            |\n| background-blend-mode            | bg-blend           |\n| background-clip                  | bg-clip            |\n| background-color                 | bg-clr             |\n| background-image                 | bg-img             |\n| background-origin                | bg-org             |\n| background-position              | bg-pos             |\n| background-repeat                | bg-rpt             |\n| background-size                  | bg-sz              |\n| border                           | brd                |\n| border-bottom                    | brd-btm            |\n| border-bottom-color              | brd-btm-clr        |\n| border-bottom-left-radius        | brd-btm-lft-rds    |\n| border-bottom-right-radius       | brd-btm-rgt-rds    |\n| border-bottom-style              | brd-btm-sty        |\n| border-bottom-width              | brd-btm-wd         |\n| border-collapse                  | brd-clps           |\n| border-color                     | brd-clr            |\n| border-image                     | brd-img            |\n| border-image-outset              | brd-img-outst      |\n| border-image-repeat              | brd-img-rpt        |\n| border-image-slice               | brd-img-slc        |\n| border-image-source              | brd-img-src        |\n| border-image-width               | brd-img-wd         |\n| border-left                      | brd-lft            |\n| border-left-color                | brd-lft-clr        |\n| border-left-style                | brd-lft-sty        |\n| border-left-width                | brd-lft-wd         |\n| border-radius                    | brd-rds            |\n| border-right                     | brd-rgt            |\n| border-right-color               | brd-rgt-clr        |\n| border-right-style               | brd-rgt-sty        |\n| border-right-width               | brd-rgt-wd         |\n| border-spacing                   | brd-spc            |\n| border-style                     | brd-sty            |\n| border-top                       | brd-top            |\n| border-top-color                 | brd-top-clr        |\n| border-top-left-radius           | brd-top-lft-rds    |\n| border-top-right-radius          | brd-top-rgt-rds    |\n| border-top-style                 | brd-top-sty        |\n| border-top-width                 | brd-top-wd         |\n| border-width                     | brd-wd             |\n| bottom                           | bttm               |\n| box-decoration-break             | bx-dcr-brk         |\n| box-shadow                       | bx-shd             |\n| box-sizing                       | bx-sz              |\n| caption-side                     | cptn-sd            |\n| clear                            | clr                |\n| clip                             | clp                |\n| color                            | clr                |\n| column-count                     | col-cnt            |\n| column-fill                      | col-fl             |\n| column-gap                       | col-gp             |\n| column-rule                      | col-rl             |\n| column-rule-color                | col-rl-clr         |\n| column-rule-style                | col-rl-sty         |\n| column-rule-width                | col-rl-wd          |\n| column-span                      | col-spn            |\n| column-width                     | col-wd             |\n| columns                          | cols               |\n| content                          | cntnt              |\n| counter-increment                | ctr-incr           |\n| counter-reset                    | ctr-rst            |\n| cursor                           | crsr               |\n| direction                        | dir                |\n| display                          | dsp                |\n| empty-cells                      | empty-c            |\n| filter                           | fltr               |\n| flex                             | flx                |\n| flex-basis                       | flx-bs             |\n| flex-direction                   | flx-dir            |\n| flex-flow                        | flx-flw            |\n| flex-grow                        | flx-grw            |\n| flex-shrink                      | flx-shrk           |\n| flex-wrap                        | flx-wrp            |\n| float                            | flt                |\n| font                             | fnt                |\n| font-family                      | fnt-fmly           |\n| font-size                        | fnt-sz             |\n| font-size-adjust                 | fnt-sz-adj         |\n| font-stretch                     | fnt-strtch         |\n| font-style                       | fnt-stl            |\n| font-variant                     | fnt-vrnt           |\n| font-weight                      | fnt-wgt            |\n| gap                              | gp                 |\n| grid                             | grd                |\n| grid-area                        | grd-ara            |\n| grid-auto-columns                | grd-auto-c         |\n| grid-auto-flow                   | grd-auto-flw       |\n| grid-auto-rows                   | grd-auto-r         |\n| grid-column                      | grd-col            |\n| grid-column-end                  | grd-col-end        |\n| grid-column-gap                  | grd-col-gp         |\n| grid-column-start                | grd-col-st         |\n| grid-gap                         | grd-gp             |\n| grid-row                         | grd-row            |\n| grid-row-end                     | grd-row-end        |\n| grid-row-gap                     | grd-row-gp         |\n| grid-row-start                   | grd-row-st         |\n| grid-template                    | grd-tmplt          |\n| grid-template-areas              | grd-tmplt-aras     |\n| grid-template-columns            | grd-tmplt-cols     |\n| grid-template-rows               | grd-tmplt-rows     |\n| height                           | ht                 |\n| hyphens                          | hypns              |\n| justify-content                  | jstf-ctnt          |\n| left                             | lft                |\n| letter-spacing                   | ltr-spc            |\n| line-height                      | ln-ht              |\n| list-style                       | lst-stl            |\n| list-style-image                 | lst-stl-img        |\n| list-style-position              | lst-stl-ps         |\n| list-style-type                  | lst-stl-ty         |\n| margin                           | mgn                |\n| margin-bottom                    | mgn-btm            |\n| margin-left                      | mgn-lft            |\n| margin-right                     | mgn-rgt            |\n| margin-top                       | mgn-top            |\n| max-height                       | max-ht             |\n| max-width                        | max-wd             |\n| min-height                       | min-ht             |\n| min-width                        | min-wd             |\n| object-fit                       | obj-ft             |\n| object-position                  | obj-ps             |\n| opacity                          | opcty              |\n| order                            | ordr               |\n| orphans                          | orphns             |\n| outline                          | otl                |\n| outline-color                    | otl-clr            |\n| outline-offset                   | otl-offst          |\n| outline-style                    | otl-stl            |\n| outline-width                    | otl-wd             |\n| overflow                         | ovflw              |\n| overflow-wrap                    | ovflw-wrp          |\n| overflow-x                       | ovflw-x            |\n| overflow-y                       | ovflw-y            |\n| padding                          | pdng               |\n| padding-bottom                   | pdng-btm           |\n| padding-left                     | pdng-lft           |\n| padding-right                    | pdng-rgt           |\n| padding-top                      | pdng-top           |\n| page-break-after                 | pg-brk-aftr        |\n| page-break-before                | pg-brk-bfr         |\n| page-break-inside                | pg-brk-insd        |\n| perspective                      | prspctv            |\n| perspective-origin               | prspctv-org        |\n| position                         | ps                 |\n| quotes                           | qts                |\n| resize                           | rsz                |\n| right                            | rght               |\n| row-gap                          | row-gp             |\n| scroll-behavior                  | scrl-bhv           |\n| table-layout                     | tbl-lyot           |\n| text-align                       | txt-aln            |\n| text-align-last                  | txt-aln-lst        |\n| text-decoration                  | txt-dcr            |\n| text-decoration-color            | txt-dcr-clr        |\n| text-decoration-line             | txt-dcr-lne        |\n| text-decoration-style            | txt-dcr-stl        |\n| text-indent                      | txt-indnt          |\n| text-justify                     | txt-jstfy          |\n| text-overflow                    | txt-ovflw          |\n| text-shadow                      | txt-shd            |\n| text-transform                   | txt-trnsf          |\n| top                              | tp                 |\n| transform                        | trnsfrm            |\n| transform-origin                 | trnsfrm-org        |\n| transform-style                  | trnsfrm-stl        |\n| transition                       | trnstn             |\n| transition-delay                 | trnstn-dly         |\n| transition-duration              | trnstn-dur         |\n| transition-property              | trnstn-prpty       |\n| transition-timing-function       | trnstn-tmf         |\n| unicode-bidi                     | uncd-bdi           |\n| user-select                      | usr-slt            |\n| vertical-align                   | vrtl-aln           |\n| visibility                       | vsblty             |\n| white-space                      | wht-spc            |\n| widows                           | wdws               |\n| width                            | wd                 |\n| word-break                       | wrd-brk            |\n| word-spacing                     | wrd-spc            |\n| word-wrap                        | wrd-wrp            |\n| writing-mode                     | wrt-mode           |\n| z-index                          | zind               |\n```\n---\n\n### Vendor Prefixes – WebKit\n\n```\n| CSS Property                         | Abbreviation        |\n|--------------------------------------|---------------------|\n| -webkit-animation                    | wkt-anim            |\n| -webkit-animation-delay              | wkt-anim-dly        |\n| -webkit-animation-direction          | wkt-anim-dir        |\n| -webkit-animation-duration           | wkt-anim-dur        |\n| -webkit-animation-fill-mode          | wkt-anim-flm        |\n| -webkit-animation-iteration-count    | wkt-anim-icnt       |\n| -webkit-animation-name               | wkt-anim-nm         |\n| -webkit-animation-play-state         | wkt-anim-ps         |\n| -webkit-animation-timing-function    | wkt-anim-tmf        |\n| -webkit-appearance                   | wkt-apprnc          |\n| -webkit-backface-visibility          | wkt-bckf-vis        |\n| -webkit-background-clip              | wkt-bg-clip         |\n| -webkit-background-origin            | wkt-bg-org          |\n| -webkit-background-size              | wkt-bg-sz           |\n| -webkit-border-bottom-left-radius    | wkt-brd-btm-lft-rds |\n| -webkit-border-bottom-right-radius   | wkt-brd-btm-rgt-rds |\n| -webkit-border-image                 | wkt-brd-img         |\n| -webkit-border-radius                | wkt-brd-rds         |\n| -webkit-border-top-left-radius       | wkt-brd-top-lft-rds |\n| -webkit-border-top-right-radius      | wkt-brd-top-rgt-rds |\n| -webkit-box-shadow                   | wkt-bx-shd          |\n| -webkit-box-sizing                   | wkt-bx-sz           |\n| -webkit-filter                      | wkt-fltr            |\n| -webkit-flex                         | wkt-flx             |\n| -webkit-flex-basis                   | wkt-flx-bs          |\n| -webkit-flex-direction               | wkt-flx-dir         |\n| -webkit-flex-flow                    | wkt-flx-flw         |\n| -webkit-flex-grow                    | wkt-flx-grw         |\n| -webkit-flex-shrink                  | wkt-flx-shrk        |\n| -webkit-flex-wrap                    | wkt-flx-wrp         |\n| -webkit-justify-content             | wkt-jstf-ctnt       |\n| -webkit-perspective                 | wkt-prspctv         |\n| -webkit-perspective-origin          | wkt-prspctv-org     |\n| -webkit-transform                   | wkt-trnsfrm         |\n| -webkit-transform-origin            | wkt-trnsfrm-org     |\n| -webkit-transform-style             | wkt-trnsfrm-stl     |\n| -webkit-transition                  | wkt-trnstn          |\n| -webkit-transition-delay            | wkt-trnstn-dly      |\n| -webkit-transition-duration         | wkt-trnstn-dur      |\n| -webkit-transition-property         | wkt-trnstn-prpty    |\n| -webkit-transition-timing-function  | wkt-trnstn-tmf      |\n```\n\n```\n| CSS Property                      | Abbreviation      |\n|-----------------------------------|-------------------|\n| accent-color                      | acnt-clr          |\n| appearance                        | apprnc            |\n| backdrop-filter                   | bkd-fltr          |\n| block-size                        | blk-sz            |\n| clip-path                         | clp-ps            |\n| color-adjust                      | clr-adj           |\n| contain                           | cntn              |\n| content-visibility                | cntnt-vis         |\n| counter-set                       | ctr-set           |\n| inset                             | ins               |\n| inset-block                       | ins-blk           |\n| inset-inline                      | ins-inn           |\n| justify-items                     | jstf-itms         |\n| justify-self                      | jstf-slf          |\n| mask                              | msk               |\n| mask-border                       | msk-brd           |\n| mask-border-mode                  | msk-brd-md        |\n| mask-border-outset                | msk-brd-out       |\n| mask-border-repeat                | msk-brd-rpt       |\n| mask-border-slice                 | msk-brd-slc       |\n| mask-border-source                | msk-brd-src       |\n| mask-border-width                 | msk-brd-wd        |\n| mask-clip                         | msk-clp           |\n| mask-composite                    | msk-cmpst         |\n| mask-image                        | msk-img           |\n| mask-mode                         | msk-md            |\n| mask-position                     | msk-ps            |\n| mask-size                         | msk-sz            |\n| max-block-size                    | max-blk-sz        |\n| max-inline-size                   | max-inn-sz        |\n| min-block-size                    | min-blk-sz        |\n| min-inline-size                   | min-inn-sz        |\n| overflow-anchor                   | ovflw-anch        |\n| overscroll-behavior               | ovrlscrl-bhv      |\n| overscroll-behavior-x             | ovrlscrl-x        |\n| overscroll-behavior-y             | ovrlscrl-y        |\n| scroll-margin                     | scrl-mgn          |\n| scroll-margin-block               | scrl-mgn-blk      |\n| scroll-margin-block-end           | scrl-mgn-blk-end  |\n| scroll-margin-block-start         | scrl-mgn-blk-st   |\n| scroll-margin-inline              | scrl-mgn-inn      |\n| scroll-margin-inline-end          | scrl-mgn-inn-end  |\n| scroll-margin-inline-start        | scrl-mgn-inn-st   |\n| scroll-padding                    | scrl-pdng         |\n| scroll-padding-block              | scrl-pdng-blk     |\n| scroll-padding-block-end          | scrl-pdng-blk-end |\n| scroll-padding-block-start        | scrl-pdng-blk-st  |\n| scroll-padding-inline             | scrl-pdng-inn     |\n| scroll-padding-inline-end         | scrl-pdng-inn-end |\n| scroll-padding-inline-start       | scrl-pdng-inn-st  |\n| scroll-snap-align                 | scrl-snp-aly      |\n| scroll-snap-stop                  | scrl-snp-stp      |\n| scroll-snap-type                  | scrl-snp-typ      |\n```\n\n## License 📄\n**MIT**\n\n## copyright\n```\n csswriteless\n Copyright (c) 2025 csswriteless.\n ```\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsuresh-pyhobbyist%2Fcsswriteless","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsuresh-pyhobbyist%2Fcsswriteless","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsuresh-pyhobbyist%2Fcsswriteless/lists"}