{"id":25359821,"url":"https://github.com/marcelo-diament/console-log-design-system","last_synced_at":"2026-05-14T21:35:55.802Z","repository":{"id":57206029,"uuid":"295276180","full_name":"Marcelo-Diament/console-log-design-system","owner":"Marcelo-Diament","description":"A npm package to make your console messages more visual and well organized","archived":false,"fork":false,"pushed_at":"2020-09-20T22:20:19.000Z","size":869,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-09-26T11:36:34.946Z","etag":null,"topics":["console-log","design-system","npm"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/console-log-design-system","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/Marcelo-Diament.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}},"created_at":"2020-09-14T01:51:52.000Z","updated_at":"2020-09-20T22:19:58.000Z","dependencies_parsed_at":"2022-09-18T01:22:26.039Z","dependency_job_id":null,"html_url":"https://github.com/Marcelo-Diament/console-log-design-system","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"purl":"pkg:github/Marcelo-Diament/console-log-design-system","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Marcelo-Diament%2Fconsole-log-design-system","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Marcelo-Diament%2Fconsole-log-design-system/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Marcelo-Diament%2Fconsole-log-design-system/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Marcelo-Diament%2Fconsole-log-design-system/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Marcelo-Diament","download_url":"https://codeload.github.com/Marcelo-Diament/console-log-design-system/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Marcelo-Diament%2Fconsole-log-design-system/sbom","scorecard":{"id":89732,"data":{"date":"2025-08-11","repo":{"name":"github.com/Marcelo-Diament/console-log-design-system","commit":"2a53d9a370bc490da300881abbed5dc4e2a4744e"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":3,"checks":[{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Code-Review","score":0,"reason":"Found 0/15 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"SAST","score":0,"reason":"no SAST tool detected","details":["Warn: no pull requests merged into dev branch"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Vulnerabilities","score":10,"reason":"0 existing vulnerabilities detected","details":null,"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}}]},"last_synced_at":"2025-08-15T07:42:10.254Z","repository_id":57206029,"created_at":"2025-08-15T07:42:10.254Z","updated_at":"2025-08-15T07:42:10.254Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":279000706,"owners_count":26082837,"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-08T02:00:06.501Z","response_time":56,"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":["console-log","design-system","npm"],"created_at":"2025-02-14T21:07:54.383Z","updated_at":"2025-10-08T21:41:44.914Z","avatar_url":"https://github.com/Marcelo-Diament.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# console.log design system\n\n![Usage Example](https://djament.com.br/img/console-log-design-system-cover.png)\n\nThis package aims to make easier to create visual console messages (including groupCollapsed ones) as well as to create containers so messages will be more organized.\n\n\u003e This is the very first version of it. If you have any suggestions, feel free to get in touch!\n\nThis message was easily displayed by running `makeComment('makeComment()', ['Testando método makeComment()'], 'important', 'md', 'badgeInverted')`\n\n![Simple Message](https://djament.com.br/img/demo-simple-example.png)\n\n* [Features](https://github.com/Marcelo-Diament/console-log-design-system#features)\n  + [makeComment()](https://github.com/Marcelo-Diament/console-log-design-system#makecomment)\n  + [makeCommentDemo()](https://github.com/Marcelo-Diament/console-log-design-system#makecommentdemo)\n  + [Next Releases](https://github.com/Marcelo-Diament/console-log-design-system#next-releases)\n* [Getting Started](https://github.com/Marcelo-Diament/console-log-design-system#getting-started)\n  + [Dependencies](https://github.com/Marcelo-Diament/console-log-design-system#dependencies)\n  + [Install Package](https://github.com/Marcelo-Diament/console-log-design-system#install-package)\n  + [Import](https://github.com/Marcelo-Diament/console-log-design-system#import)\n  + [Usage](https://github.com/Marcelo-Diament/console-log-design-system#usage)\n* [Screenshots](https://github.com/Marcelo-Diament/console-log-design-system#screenshots)\n* [More Details About makeComment()](https://github.com/Marcelo-Diament/console-log-design-system#more-details-about-makecomment)\n* [Contact Me](https://github.com/Marcelo-Diament/console-log-design-system#contact-me)\n\n___\n\n## Features\n\n### makeComment\n\nIs the method responsable by printing the log message in the console. You can choose wether to display one or more `console.log()` messages or to print grouped `console.log()` message(s) within a `console.groupCollapsed()` group of messages.\n\n![Complex Message](https://djament.com.br/img/demo-react-datalayer-component-example.png)\n\n_This is an more complex possible application of the `makeComment()` method, in this example, to display datalayer pushed tags_\n\nIt is possible to define:\n\n* **Title** (the message or message group title)\n\n* **Comments** (the second part of the message or the inner messages)\n\n* **Status** (like success, error, warning, info...), \n\n* **Size** (for example large, small, extra extra small...)\n\n* **Type** (main, secondary, badge or badgeInverted) of the message.\n\n### makeCommentDemo\n\nA visual guide made to help you when choosing which style is more appropriate to each message to be displayed.\n\n![initial message displayed by makeCommentDemo](https://djament.com.br/img/feature-makeCommentDemo-01-param-options.png)\n\n### Next Releases\n\n**Custom Style with consoleDefaultParams prop**\n| It is in the roadmap to implement a feature that allows user to define its own color theme.\n\n___\n\n## Getting Started\n\n### Dependencies\n\nYou must have node.js installed in you environment. You can ensure you have it installed by running `node -v` in the terminal of your preference.\n\n### Install Package\n\nYou just need to run `npm i console-log-design-system` or you can directly download it from [npm oficial website](https://www.npmjs.com/package/console-log-design-system).\n\n### Import\n\n**How To Import Both makeComment() and makeCommentDemo()**\n\nYou can import the `makeComment()` and `makeCommentDemo()` methods simply by copying and pasting the following code snippet in yout component/module:\n\n``` js\nimport clds from 'console-log-design-system';\nconst {\n    makeComment,\n    makeCommentDemo\n} = clds;\n```\n\nYou can also import it in a more manual manner, by importing in your vanilla JS script\n\n``` js\nimport clds from './console-log-design-system/index';\nconst {\n    makeComment,\n    makeCommentDemo\n} = clds;\n```\n\n...and then, calling your script as a module in you HTML file:\n\n``` html\n\u003cscript type=\"module\" src=\"./main.js\"\u003e\u003c/script\u003e\n```\n\n**How To Import makeComment()**\n\nYou can import the `makeComment()` method simply by copying and pasting the following code snippet in yout component/module:\n\n``` js\nimport clds from 'console-log-design-system';\nconst {\n    makeComment\n} = clds;\n```\n\nYou can also import it in a more manual manner, by importing in your vanilla JS script\n\n``` js\nimport clds from './console-log-design-system/index';\nconst {\n    makeComment\n} = clds;\n```\n\n...and then, calling your script as a module in you HTML file:\n\n``` html\n\u003cscript type=\"module\" src=\"./main.js\"\u003e\u003c/script\u003e\n```\n\n**How To Import makeCommentDemo()**\n\nYou can import the `makeCommentDemo()` method simply by copying and pasting the following code snippet in yout component/module:\n\n``` js\nimport clds from 'console-log-design-system';\nconst {\n    makeCommentDemo\n} = clds;\n```\n\nYou can also import it in a more manual manner, by importing in your vanilla JS script\n\n``` js\nimport clds from './console-log-design-system/index';\nconst {\n    makeCommentDemo\n} = clds;\n```\n\n...and then, calling your script as a module in you HTML file:\n\n``` html\n\u003cscript type=\"module\" src=\"./main.js\"\u003e\u003c/script\u003e\n```\n\n### Usage\n\n**How to use `makeComment()` ?**\n\nYou have to pass at leat a **title** as the first argument (that expect to receive a **string** typed argument).\n\n``` js\nmakeComment('My Title');\n```\n\nIn this case, message displayed will have the default status, a medium size and its type defined as main.\n\nBut you can pass more optional arguments, such as:\n\n**comments**\n\nAn array with different comments. Each one of them will be displayed with `console.log` method\n\n**status**\n\n**`makeCommentDemo()` status options preview**\n\n![status options preview](https://djament.com.br/img/feature-makeCommentDemo-0203-status-param-options.png)\n\nA string that represent the status of the message and define its colors. It is pobbible to choose between 'default', 'bw', 'wb', 'fail', 'danger', 'alert', 'warning', 'info', 'success', 'successful', 'important'\n\n**size**\n\n**`makeCommentDemo()` size options preview**\n\n![size options preview](https://djament.com.br/img/feature-makeCommentDemo-0201-size-param-options.png)\n\nDefines sizes of the message. Possible values: 'xxs, 'xs', 'sm', 'md', 'lg', 'xl', 'xxl'\n\n**type**\n\n**`makeCommentDemo()` type options preview**\n\n![type options preview](https://djament.com.br/img/feature-makeCommentDemo-0202-type-param-options.png)\n\nYou can choose one of the following options: 'main', 'secondary', 'badge', 'badgeInverted'. The secondary type does not use `console.groupCollapsed` method, so title is joined with messages but it still have its own style.\n\n**How to use `makeCommentDemo()` ?**\n\nIt doesn't require any params, you just need to import it and to call it passing the arguments you want to.\n\n![Initial console.groupCollapsed() Message](https://djament.com.br/img/feature-makeCommentDemo-01-param-options.png)\n\n___\n\n## Screenshots\n\nSome other screenshots to show how flexible can be the this package\n\n![Preview 01](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-01.png)\n\n![Preview 02](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-02.png)\n\n![Preview 03](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-03.png)\n\n![Preview 04](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-04.png)\n\n![Preview 05](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-05.png)\n\n![Preview 06](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-06.png)\n\n![Preview 07](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-07.png)\n\n![Preview 08](https://djament.com.br/img/feature-makeCommentDemo-03-mixed-08.png)\n\n___\n\n## More Details About `makeComment()`\n\n**`makeComment()`**\n\n``` js\n/**\n * @function makeComment\n * Returns a comment to console with a custom style according to the passed arguments\n * \n * @param {String} title - the title of the comment (set as groupCollapsed as default)\n * @param {Array|undefined} [comments=[]] - array with each comment to be consoled as a string element\n * @param {String='default','bw','wb','fail','danger','alert','warning','info','success','successful','important'} [status='default'] - status to be used to define its style (default|bw|wb|fail|danger|alert|warning|info|success|successful|important)\n * @param {String='xxs,'xs','sm','md','lg','xl','xxl'} [size='md'] - defines font properties (xxs|xs|sm|md|lg|xl|xxl)\n * @param {String='main','secondary','badge','badgeInverted'} [type='main'] - defines wich style to be applied (main|secondary|badge|badgeInverted)\n * \n * @requires consoleDefaultParams - that maps its styles template properties\n */\n```\n\n**`consoleDefaultParams`**\n\n``` js\n/**\n * @const consoleDefaultParams\n * Detains all default template console style\n * @namespace\n * @property {object} size - defines font-size, line-height as well as padding and margin according to its arguments passed (size and 'scenery')\n * @property {object} size.xxs - defines extra small properties\n * @property {object} size.xxs.main - defines main type (style) extra extra small properties\n * @property {object} size.xxs.secondary - defines secondary type (style) extra extra small properties\n * @property {object} size.xxs.badge - defines badge type (style) extra extra small properties\n * @property {object} size.xxs.badgeInverted - defines badgeInverted type (style) extra extra small properties\n * @property {object} size.xs - defines extra small properties\n * @property {object} size.xs.main - defines main type (style) extra small properties\n * @property {object} size.xs.secondary - defines secondary type (style) extra small properties\n * @property {object} size.xs.badge - defines badge type (style) extra small properties\n * @property {object} size.xs.badgeInverted - defines badgeInverted type (style) extra small properties\n * @property {object} size.sm - defines small properties\n * @property {object} size.sm.main - defines main type (style) small properties\n * @property {object} size.sm.secondary - defines secondary type (style) small properties\n * @property {object} size.sm.badge - defines badge type (style) small properties\n * @property {object} size.sm.badgeInverted - defines badgeInverted type (style) small properties\n * @property {object} size.md - defines medium properties (default)\n * @property {object} size.md.main - defines main type (style) medium properties (default)\n * @property {object} size.md.secondary - defines secondary type (style) medium properties (default)\n * @property {object} size.md.badge - defines badge type (style) medium properties (default)\n * @property {object} size.md.badgeInverted - defines badgeInverted type (style) medium properties (default)\n * @property {object} size.lg - defines large properties\n * @property {object} size.lg.main - defines main type (style) large properties\n * @property {object} size.lg.secondary - defines secondary type (style) large properties\n * @property {object} size.lg.badge - defines badge type (style) large properties\n * @property {object} size.lg.badgeInverted - defines badgeInverted type (style) large properties\n * @property {object} size.xl - defines extra large properties\n * @property {object} size.xl.main - defines main type (style) extra large properties\n * @property {object} size.xl.secondary - defines secondary type (style) extra large properties\n * @property {object} size.xl.badge - defines badge type (style) extra large properties\n * @property {object} size.xl.badgeInverted - defines badgeInverted type (style) extra large properties\n * @property {object} size.xxl - defines extra extra large properties\n * @property {object} size.xxl.main - defines main type (style) extra extra large properties\n * @property {object} size.xxl.secondary - defines secondary type (style) extra extra large properties\n * @property {object} size.xxl.badge - defines badge type (style) extra extra large properties\n * @property {object} size.xxl.badgeInverted - defines badgeInverted type (style) extra extra large properties\n * @property {object} color - defines color, background-color as well as border style, according to its arguments ('status' and 'scenery')\n * @property {object} color.default - defines extra small properties\n * @property {object} color.default.main - defines main type (style) default color properties\n * @property {object} color.default.secondary - defines secondary type (style) default color properties\n * @property {object} color.default.badge - defines badge type (style) default color properties\n * @property {object} color.default.badgeInverted - defines badgeInverted type (style) default color properties\n * @property {object} color.bw - defines extra small properties\n * @property {object} color.bw.main - defines main type (style) bw color properties\n * @property {object} color.bw.secondary - defines secondary type (style) bw color properties\n * @property {object} color.bw.badge - defines badge type (style) bw color properties\n * @property {object} color.bw.badgeInverted - defines badgeInverted type (style) bw color properties\n * @property {object} color.wb - defines extra small properties\n * @property {object} color.wb.main - defines main type (style) wb color properties\n * @property {object} color.wb.secondary - defines secondary type (style) wb color properties\n * @property {object} color.wb.badge - defines badge type (style) wb color properties\n * @property {object} color.wb.badgeInverted - defines badgeInverted type (style) wb color properties\n * @property {object} color.error - defines extra small properties\n * @property {object} color.error.main - defines main type (style) error color properties\n * @property {object} color.error.secondary - defines secondary type (style) error color properties\n * @property {object} color.error.badge - defines badge type (style) error color properties\n * @property {object} color.error.badgeInverted - defines badgeInverted type (style) error color properties\n * @property {object} color.fail - defines extra small properties\n * @property {object} color.fail.main - defines main type (style) fail color properties\n * @property {object} color.fail.secondary - defines secondary type (style) fail color properties\n * @property {object} color.fail.badge - defines badge type (style) fail color properties\n * @property {object} color.fail.badgeInverted - defines badgeInverted type (style) fail color properties\n * @property {object} color.danger - defines extra small properties\n * @property {object} color.danger.main - defines main type (style) danger color properties\n * @property {object} color.danger.secondary - defines secondary type (style) danger color properties\n * @property {object} color.danger.badge - defines badge type (style) danger color properties\n * @property {object} color.danger.badgeInverted - defines badgeInverted type (style) danger color properties\n * @property {object} color.alert - defines extra small properties\n * @property {object} color.alert.main - defines main type (style) alert color properties\n * @property {object} color.alert.secondary - defines secondary type (style) alert color properties\n * @property {object} color.alert.badge - defines badge type (style) alert color properties\n * @property {object} color.alert.badgeInverted - defines badgeInverted type (style) alert color properties\n * @property {object} color.warning - defines extra small properties\n * @property {object} color.warning.main - defines main type (style) warning color properties\n * @property {object} color.warning.secondary - defines secondary type (style) warning color properties\n * @property {object} color.warning.badge - defines badge type (style) warning color properties\n * @property {object} color.warning.badgeInverted - defines badgeInverted type (style) warning color properties\n * @property {object} color.info - defines extra small properties\n * @property {object} color.info.main - defines main type (style) info color properties\n * @property {object} color.info.secondary - defines secondary type (style) info color properties\n * @property {object} color.info.badge - defines badge type (style) info color properties\n * @property {object} color.info.badgeInverted - defines badgeInverted type (style) info color properties\n * @property {object} color.success - defines extra small properties\n * @property {object} color.success.main - defines main type (style) success color properties\n * @property {object} color.success.secondary - defines secondary type (style) success color properties\n * @property {object} color.success.badge - defines badge type (style) success color properties\n * @property {object} color.success.badgeInverted - defines badgeInverted type (style) success color properties\n * @property {object} color.sucessful - defines extra small properties\n * @property {object} color.sucessful.main - defines main type (style) sucessful color properties\n * @property {object} color.sucessful.secondary - defines secondary type (style) sucessful color properties\n * @property {object} color.sucessful.badge - defines badge type (style) sucessful color properties\n * @property {object} color.sucessful.badgeInverted - defines badgeInverted type (style) sucessful color properties\n * @property {object} color.important - defines extra small properties\n * @property {object} color.important.main - defines main type (style) important color properties\n * @property {object} color.important.secondary - defines secondary type (style) important color properties\n * @property {object} color.important.badge - defines badge type (style) important color properties\n * @property {object} color.important.badgeInverted - defines badgeInverted type (style) important color properties\n * @property {object} color.log - defines extra small properties\n * @property {object} color.log.main - defines main type (style) log color properties\n * @property {object} color.log.secondary - defines secondary type (style) log color properties\n * @property {object} color.log.badge - defines badge type (style) log color properties\n * @property {object} color.log.badgeInverted - defines badgeInverted type (style) log color properties\n */\n```\n\n___\n\n## Contact Me\n\n**Marcelo Diament** | Front End Developer and Instructor\n\n[Github][Github] | [LinkedIn][LinkedIn]\n\n[//]: # \n\n[Github]: \u003chttps://github.com/Marcelo-Diament\u003e\n[LinkedIn]: \u003chttps://linkedin.com/in/marcelodiament\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmarcelo-diament%2Fconsole-log-design-system","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmarcelo-diament%2Fconsole-log-design-system","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmarcelo-diament%2Fconsole-log-design-system/lists"}