{"id":15041315,"url":"https://github.com/saddamcrr7/project-neon","last_synced_at":"2025-06-13T05:32:13.004Z","repository":{"id":41456394,"uuid":"117339199","full_name":"saddamcrr7/project-neon","owner":"saddamcrr7","description":"Neon is a very Simple, Modern, easy to use CSS based library that inherits effect from background ","archived":false,"fork":false,"pushed_at":"2018-01-18T11:47:19.000Z","size":16,"stargazers_count":13,"open_issues_count":0,"forks_count":0,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-05-16T18:08:01.983Z","etag":null,"topics":["css-framework","css-library","css-modules","fluent-design","front-end-development","microsoft-neon","open-source","sass-library"],"latest_commit_sha":null,"homepage":"","language":"CSS","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/saddamcrr7.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-01-13T11:46:18.000Z","updated_at":"2025-05-09T17:22:59.000Z","dependencies_parsed_at":"2022-08-23T14:00:44.215Z","dependency_job_id":null,"html_url":"https://github.com/saddamcrr7/project-neon","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/saddamcrr7/project-neon","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saddamcrr7%2Fproject-neon","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saddamcrr7%2Fproject-neon/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saddamcrr7%2Fproject-neon/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saddamcrr7%2Fproject-neon/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/saddamcrr7","download_url":"https://codeload.github.com/saddamcrr7/project-neon/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/saddamcrr7%2Fproject-neon/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259589110,"owners_count":22880912,"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":["css-framework","css-library","css-modules","fluent-design","front-end-development","microsoft-neon","open-source","sass-library"],"created_at":"2024-09-24T20:45:56.958Z","updated_at":"2025-06-13T05:32:12.972Z","avatar_url":"https://github.com/saddamcrr7.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# project-neon\nNeon is a very simple Modern, easy to use CSS based library. Neon made with an awesome variation of CSS3 Filter, Box shadow, Background inherit property that takes neon effect from your background Image. Neon inspired by Microsoft Fluent Design concept. \n\nNeon will provide a revolutionary user experience on your website Buttton, Modal, Hover effect, Navigation, Dropdown Menu etc. \nNeon is an eloquent CSS effect for a complex world.\n\n**Demo:** [coderentor.com/project-neon](http://coderentor.com/project-neon/)\n\n\n## Installation\n\n### npm\n```\nnpm install --save project-neon\n```\nNow add it to your project:\n```html\n\u003chtml\u003e\n  \u003chead\u003e\n    ...\n    \u003clink rel=\"stylesheet\" type=\"text/css\" href=\"/path/to/neon.min.css\"\u003e\n  \u003c/head\u003e\n  \u003cbody\u003e\n    ...\n  \u003c/body\u003e\n\u003c/html\u003e\n```\n## Usage\n\nNeon takes effect from your parent div background image.\n\n### HTML\n\n```HTML\n\u003cdiv class=\"demo-bg\"\u003e\n    \u003cbutton class=\"neon-info-hi\"\u003eDemo button\u003c/button\u003e\n\u003c/div\u003e\n```\n\n### CSS\n\n```CSS\n    .demo-bg{\n        background: url(\"../path/to/image.jpg\") fixed;\n        /* set your custom CSS */\n    }\n    /* customize your button  for better look  */\n```\n\n## Options\nYou can set saven different colors \u0026 four different effect\n\n#### `Neon options`\n\nMain | Color | Effect | CSS Class\n------------ | ------------- | ------------- | -------------\nNeon | Standard | Standard | .neon-st-st\nNeon | Standard | Medium | .neon-st-md\nNeon | Standard | High | .neon-st-hi\nNeon | Standard | Extra High | .neon-st-ex-hi\nNeon | Light | Standard | .neon-light-st\nNeon | Light | Medium | .neon-light-md\nNeon | Light | High | .neon-light-hi\nNeon | Light | Extra High | .neon-light-ex-hi\nNeon | Dark | Standard | .neon-dark-st\nNeon | Dark | Medium | .neon-dark-md\nNeon | Dark | High | .neon-dark-hi\nNeon | Dark | Extra High | .neon-dark-ex-hi\nNeon | success | Standard | .neon-success-st\nNeon | success | Medium | .neon-success-md\nNeon | success | High | .neon-success-hi\nNeon | success | Extra High | .neon-success-ex-hi\nNeon | warning | Standard | .neon-warning-st\nNeon | warning | Medium | .neon-warning-md\nNeon | warning | High | .neon-warning-hi\nNeon | warning | Extra High | .neon-warning-ex-hi\nNeon | danger | Standard | .neon-danger-st\nNeon | danger | Medium | .neon-danger-md\nNeon | danger | High | .neon-danger-hi\nNeon | danger | Extra High | .neon-danger-ex-hi\nNeon | info | Standard | .neon-info-st\nNeon | info | Medium | .neon-info-md\nNeon | info | High | .neon-info-hi\nNeon | info | Extra High | .neon-info-ex-hi\nNeon | purple | Standard | .neon-purple-st\nNeon | purple | Medium | .neon-purple-md\nNeon | purple | High | .neon-purple-hi\nNeon | purple | Extra High | .neon-purple-ex-hi\n\n## Licence\nNeon is under [MIT licence](https://opensource.org/licenses/mit-license.php)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsaddamcrr7%2Fproject-neon","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsaddamcrr7%2Fproject-neon","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsaddamcrr7%2Fproject-neon/lists"}