{"id":16068120,"url":"https://github.com/misterzik/colores","last_synced_at":"2026-04-28T20:01:52.823Z","repository":{"id":58243857,"uuid":"96157286","full_name":"misterzik/Colores","owner":"misterzik","description":"Color.es is a tiny bit CSS library fueled with SCSS on the back.","archived":false,"fork":false,"pushed_at":"2020-08-22T04:47:27.000Z","size":144,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-18T05:00:40.301Z","etag":null,"topics":["color-palette","css","exciting-colors","scss","tones"],"latest_commit_sha":null,"homepage":"","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/misterzik.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-07-03T23:20:51.000Z","updated_at":"2020-08-22T04:30:56.000Z","dependencies_parsed_at":"2022-08-31T01:01:46.195Z","dependency_job_id":null,"html_url":"https://github.com/misterzik/Colores","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/misterzik%2FColores","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/misterzik%2FColores/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/misterzik%2FColores/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/misterzik%2FColores/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/misterzik","download_url":"https://codeload.github.com/misterzik/Colores/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247318746,"owners_count":20919483,"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","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":["color-palette","css","exciting-colors","scss","tones"],"created_at":"2024-10-09T06:08:37.051Z","updated_at":"2026-04-28T20:01:47.801Z","avatar_url":"https://github.com/misterzik.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"![alt text](colores-logo.png \"Color.es by MisterZik\")\n## Color.es\n---\n#### Colores also known as Color.es\n\nColor.es is a tiny bit CSS library fueled with SCSS on the back.\n\n![alt text](Showcase-legacy.png \"Background colors \u0026 Font Colors based on Popular Palettes for 2017. (CSS Only)\")\n\n### Installation\n* Download [ZIP](https://github.com/misterzik/Colores/archive/master.zip) or Clone Project\n* Bower\n`bower install colores`\n\n\n### Usage\nColor.es comes with a built-in demo, Please refer to folder `/public`. If you would like to skip the demo, all you have to do is:\n\n1. Include the `css` files located in the `dist` folder on your root folder.\n2. Include this new files on your `index.html`.\n```\n\u003clink rel=\"stylesheet\" href=\"color.es.min.css\"\u003e\n```\n3. Use the Class name `colores` to get the classes style properly place on your DOM, follow up with the color from the default palette.\n\nExample )\nFor this example, I am going to use the color yellow in default/primary color.\n\n `colores yellow` - This will change the color of the container or background.\n\n\n How About RED?\n \n Pretty Simple, same idea behind, start by specifying the class name `colores` follow by the color `red`\n \n ``` \n \u003cdiv class=\"colores red\"\u003e IS MY BG RED? \u003c/div\u003e\n```\n\n\n#### W00t! w00t!, Sweet, but how about if i want to change the text color,\nIt's okay, we got ya all cover, now since we only want the text color to change instead of the background color\nwe are going to replace the class name `colores` for `txt-cls` follow by the color\n\n ```\n txt-cls yellow\n ``` \n \n#### HTML:\n```\n\u003cdiv class=\"colores yellow\"\u003e\n  This is a Yellow Box\n\u003c/div\u003e\n```\n\n```\n\u003cspan class=\"txt-cls yellow\"\u003e\n  This is a Yellow Text\n\u003c/span\u003e\n```\n\n###### Put it together:\n```\n\u003cdiv class=\"colores yellow\"\u003e\n  This is a Yellow Box\n  This is a \u003cspan class=\"txt-cls yellow-dark\"\u003eDark Yellow\u003c/span\u003e Text\n\u003c/div\u003e\n```\n###### Colores Variations:\nUse the proper class to change the style desired `txt-cls` or\n`colores yellow`\n\nAsides from that we have also included three tones asides from library primary tone in order to use it\nyou just have to specify the tone, if left blank the tone will go instantly to primary, you have three options light, dark, and darker\ndepending on the option you will get the right property, per example.\n\n ```\n colores yellow = Default Tone\n colores yellow-light = Lighter tone from Default \n colores yellow-dark = Dark tone from Default\n colores yellow-darker =  Darker tone from Dark Tone\n ```\n\n\n### Default Color Palette\n\n| Class Name  |  Color Name   | Extra Option      |\n| ------------|:-------------:| -----------------:|\n| colores     | yellow        | light,dark,darker |\n| colores     | blue        | light,dark,darker |\n| colores     | red       | light,dark,darker |\n| colores     | pink       | light,dark,darker |\n| colores     | orange        | light,dark,darker |\n| colores     | mz-orange        | light,dark,darker |\n| colores     | purple        | light,dark,darker |\n| colores     | cyan        | light,dark,darker |\n| colores     | grey        | light,dark,darker |\n| colores     | brown       | light,dark,darker |\n| colores     | green       | light,dark,darker |\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmisterzik%2Fcolores","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmisterzik%2Fcolores","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmisterzik%2Fcolores/lists"}