{"id":19520287,"url":"https://github.com/henryhale/chalk-dom","last_synced_at":"2025-07-23T18:32:35.135Z","repository":{"id":114995179,"uuid":"605508629","full_name":"henryhale/chalk-dom","owner":"henryhale","description":"🖍  Chalk for the browser","archived":false,"fork":false,"pushed_at":"2024-10-30T10:28:53.000Z","size":22,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-22T18:54:47.636Z","etag":null,"topics":["browser","chalk","colors","css","dev","henryhale","html","javascript","readline","terminal","terminal-colors"],"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/henryhale.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}},"created_at":"2023-02-23T10:01:16.000Z","updated_at":"2024-10-30T10:28:56.000Z","dependencies_parsed_at":"2024-06-06T08:10:16.636Z","dependency_job_id":null,"html_url":"https://github.com/henryhale/chalk-dom","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/henryhale/chalk-dom","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/henryhale%2Fchalk-dom","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/henryhale%2Fchalk-dom/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/henryhale%2Fchalk-dom/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/henryhale%2Fchalk-dom/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/henryhale","download_url":"https://codeload.github.com/henryhale/chalk-dom/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/henryhale%2Fchalk-dom/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266732018,"owners_count":23975949,"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-23T02:00:09.312Z","response_time":66,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"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":["browser","chalk","colors","css","dev","henryhale","html","javascript","readline","terminal","terminal-colors"],"created_at":"2024-11-11T00:24:48.886Z","updated_at":"2025-07-23T18:32:35.102Z","avatar_url":"https://github.com/henryhale.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align='center'\u003e\n\u003ch1\u003eChalk-dom\u003c/h1\u003e\n\u003cp\u003echalk for the browser\u003c/p\u003e\n\u003cimg src=\"https://github.com/henryhale/chalk-dom/blob/master/media/screenshot.png\" alt=\"\"\u003e\n\u003c/div\u003e\n\u003cbr/\u003e\n\n\u003e Just like [chalk](https://github.com/chalk/chalk) but right in your browser. It uses HTML elements (b,s,i,span) and a little inline-css.\n\n\u003cbr\u003e\n\u003cdiv align=\"center\"\u003e\n\u003cimg alt=\"GitHub Workflow Status\" src=\"https://img.shields.io/github/actions/workflow/status/henryhale/chalk-dom/npm-publish.yml\"\u003e\n\u003cimg alt=\"npm\" src=\"https://img.shields.io/npm/v/chalk-dom\"\u003e\n\u003cimg alt=\"GitHub release (latest SemVer)\" src=\"https://img.shields.io/github/v/release/henryhale/chalk-dom\"\u003e\n\u003cimg alt=\"GitHub\" src=\"https://img.shields.io/github/license/henryhale/chalk-dom\"\u003e\n\u003c/div\u003e\n\u003cbr/\u003e\n\n## Features\n\n- Expressive API\n- Highly performant\n- Ability to nest styles\n- Customizable\n- Doesn't extend `String.prototype`\n- Clean and focused\n- Maintained\n\n## Install\n\n```console\n$ npm install chalk-dom\n```\n\n## Usage\n\n### HTML\n\n```html\n\u003cdiv id='console'\u003e\u003c/div\u003e\n```\n\n### JavaScript\n\n```js\nimport chalk from 'chalk-dom';\n\nconst consoleBox = document.getElementById('console');\n\nfunction log(...data) {\n    consoleBox.innerHTML += `\u003cdiv\u003e${data.join(' ')}\u003c/div\u003e`;\n}\n\nlog(chalk.blue('Hello World!'));\n```\n\n## Demo\n\nTo run the [demo](https://github.com/henryhale/chalk-dom/blob/master/demo), clone this repo and simply open the [index.html](https://github.com/henryhale/chalk-dom/blob/master/demo/index.html) file in your browser.\n\n## API\n\nThe one difference with [inken](https://github.com/henryhale/inken) is styles can be chained with [chalk-dom](https://github.com/henryhale/chalk-dom).\n\n```js\nimport chalk from 'chalk-dom';\n\n...\n\nlog(chalk.bgBlack.yellow.italic('Hello, World!'));\n```\n\n## Styles\n\n### Modifiers\n\n- `bold` - Make the text bold.\n- `dim` - Make the text have lower opacity (sets css opacity to `0.5`).\n- `italic` - Make the text italic.\n- `underline` - Underline the text.\n- `strikethrough` - Put a horizontal line through the center of the text.\n- `inverse` - Invert the background and foreground colors.\n\n### User defined\n\n- `fg` - Set a custom foreground color (text color)\n- `bg` - Set a custom background color\n\n### Colors\n\n- `black`\n- `red`\n- `green`\n- `yellow`\n- `blue`\n- `magenta`\n- `cyan`\n- `white`\n- `gray`\n\n### Background colors\n\n- `bgBlack`\n- `bgRed`\n- `bgGreen`\n- `bgYellow`\n- `bgBlue`\n- `bgMagenta`\n- `bgCyan`\n- `bgWhite`\n- `bgGray`\n\n## Related\n\n- [Inken](https://github.com/henryhale/inken) - terminal-like string styling for the browser\n- [xterminal](https://github.com/henryhale/xterminal) - build web-based cli interfaces \n\n## LICENSE\n\nReleased under the [MIT License](https://github.com/henryhale/chalk-dom/blob/master/LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhenryhale%2Fchalk-dom","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhenryhale%2Fchalk-dom","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhenryhale%2Fchalk-dom/lists"}