{"id":22208863,"url":"https://github.com/bioruebe/markdown-it-label","last_synced_at":"2025-07-27T09:30:43.610Z","repository":{"id":57291233,"uuid":"252918815","full_name":"Bioruebe/markdown-it-label","owner":"Bioruebe","description":"A markdown-it plugin, which adds labels/tags","archived":false,"fork":false,"pushed_at":"2024-04-21T09:34:33.000Z","size":140,"stargazers_count":4,"open_issues_count":1,"forks_count":3,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-06-29T13:46:33.030Z","etag":null,"topics":["markdown-it","markdown-it-plugin","tagging"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","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/Bioruebe.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}},"created_at":"2020-04-04T05:42:21.000Z","updated_at":"2024-04-21T09:33:54.000Z","dependencies_parsed_at":"2022-09-01T14:01:01.034Z","dependency_job_id":"9ce292aa-db74-4a1a-9c20-664b03925e2c","html_url":"https://github.com/Bioruebe/markdown-it-label","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/Bioruebe/markdown-it-label","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Bioruebe%2Fmarkdown-it-label","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Bioruebe%2Fmarkdown-it-label/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Bioruebe%2Fmarkdown-it-label/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Bioruebe%2Fmarkdown-it-label/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Bioruebe","download_url":"https://codeload.github.com/Bioruebe/markdown-it-label/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Bioruebe%2Fmarkdown-it-label/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267338518,"owners_count":24071363,"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-07-27T02:00:11.917Z","response_time":82,"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":["markdown-it","markdown-it-plugin","tagging"],"created_at":"2024-12-02T19:23:25.437Z","updated_at":"2025-07-27T09:30:43.347Z","avatar_url":"https://github.com/Bioruebe.png","language":"TypeScript","readme":"# markdown-it-label\n\n[![npm](https://img.shields.io/npm/v/markdown-it-label)](https://www.npmjs.com/package/markdown-it-label) [![Node.js CI](https://github.com/Bioruebe/markdown-it-label/actions/workflows/node.js.yml/badge.svg)](https://github.com/Bioruebe/markdown-it-label/actions/workflows/node.js.yml) ![markdown-it](https://img.shields.io/npm/dependency-version/markdown-it-label/peer/markdown-it)\n\n\u003e A markdown-it plugin, which adds labels/tags\n\n## Preview\n\n![preview](docs/preview.png)\n\n## Usage\n\n### Install\n\n```bash\nnpm install markdown-it-label\n```\n\n### Enable\n\n```js\n// ESM\nimport MarkdownIt from \"markdown-it\";\nimport MarkdownItLabel from \"markdown-it-label\";\nconst md = new MarkdownIt().use(MarkdownItLabel, options);\n\n// CommonJS\nconst markdownIt = require(\"markdown-it\");\nconst markdownItLabel = require(\"markdown-it-label\");\nconst md = markdownIt().use(markdownItLabel, options);\n```\n\n### Syntax\n\n```md\n#[Label text](color)\n```\n\ne.g.\n\n```md\n#[important](red)\n```\n\nis interpreted as\n\n```html\n\u003cspan class=\"mdi-label mdi-label-text-light\" style=\"background-color: rgb(255, 0, 0)\"\u003e\n    important\n\u003c/span\u003e\n```\n\n#### Colors\n\nColors can be specified in multiple ways:\n\n- [Color names](https://www.w3schools.com/colors/colors_names.asp): `red`, `gold`, `WhiteSmoke`\n- Hex colors: `#FF0000`, `#F5F5F5`\n- Shorthand hexadecimal form: `#000`, `#09C`\n\nThe background color is set automatically based on the brightness of the background. Dark and light text colors can be set via options object.\n\n##### Shorthand usage\n\nThe color of each label has to be defined only once in the document. Any label with the same text will then use it without explicitly specifying it. It does not matter if the label is defined before or after the shorthand usage.\n\n```md\n## Define label color anywhere in the document\n#[important](yellow)\n\n## Use shorthand without the color argument\n#[important]()\n\n## You can override the color on a per-label basis\n** This label is red **\n#[important](red)\n\n** All others are yellow **\n#[important]()\n```\n\n\n### Example CSS\n\n```css\n.mdi-label {\n    padding: .2em .6em .3em;\n    font-size: 75%;\n    font-weight: 700;\n    white-space: nowrap;\n    vertical-align: baseline;\n    border-radius: .25em;\n}\n\n.mdi-label-text-light {\n    color: white\n}\n\n.mdi-label-text-dark {\n    color: #332900\n}\n```\n\n## Options\n\n###### Default values\n\n```js\n{\n    cssClassLabel: \"mdi-label\",\n    cssClassTextLight: \"mdi-label-text-light\",\n    cssClassTextDark: \"mdi-label-text-dark\"\n}\n```\n\n###### cssClassLabel\n\nThe class to assign to the `span` element. Useful for styling the label.\n\n###### cssClassTextLight, cssClassTextDark\n\nThe CSS class to be used for the label text. Which of the two is used depends on the background color and is chosen automatically to ensure proper contrast.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbioruebe%2Fmarkdown-it-label","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbioruebe%2Fmarkdown-it-label","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbioruebe%2Fmarkdown-it-label/lists"}