node package manager
Easy sharing. Manage teams and permissions with one click. Create a free org ยป



Styledocs is a style document generator. It parse through stylesheet and creates style documents based on the comments provided in it. Its a customized version of jacobrask's styledocco.


npm install -g styledocs


styledocs [options] [INPUT]

styledocco -n "My Project" css or styledocco -n "My Project" style.css


  • --name, -n Name of the project (required)
  • --out, -o Output directory (default: "docs")
  • --resources, -s Directory for custom template, CSS and JavaScript. Can be the same as the output directory if you don't want to overwrite your changes. StyleDocco defaults will be used for any required file not found in this directory. (optional)
  • --preprocessor Custom preprocessor command. To disable preprocessing, use none. (optional) (ex: --preprocessor "scss --load-path=deps/")
  • --include Prepend specified CSS file to the documentation stylesheet. (optional) (ex: --include mysite.css)

### Example

/*#breadcrumb <div class="breadcrumb"><a href="">Home</a><span>Email</span></div> */

.breadcrumb a{ padding-right:10px; text-decoration:none; } .breadcrumb a:after{ content: '>'; width: 15px; height: 14px; display: inline-block; background: red; font-size: 11px; text-align: center; border-radius: 15px; margin-left: 10px; color: white; font-weight: bold;

} .breadcrumb a:hover{ color:gray; } .breadcrumb span{ color:green; }

/* #search <form id="searchFrmNormal" action="" method="get" class="search" onsubmit="return searchboxValidate('Search')"><input accesskey="f" name="q" type="text" id="search-text" class="txt-search" placeholder="Search" value="Search"><input type="submit" class="btn-search" value=">"></form> */

.search{ background:#f1f1f1; border:1px solid #ccc; padding:5px 10px; display:inline-block; border-radius:5px; }

.search input{ background:none; border:0; }

.search input[type="submit"]{ border-radius:5px; background:#333; font-size:13px; font-weight:bold; color:#fff; }