{"id":15618007,"url":"https://github.com/omnedia/ngx-starry-sky","last_synced_at":"2026-03-06T12:32:50.812Z","repository":{"id":254017017,"uuid":"845052174","full_name":"omnedia/ngx-starry-sky","owner":"omnedia","description":"A simple component library to create a container with an animated background.","archived":false,"fork":false,"pushed_at":"2025-11-29T17:12:28.000Z","size":31,"stargazers_count":1,"open_issues_count":0,"forks_count":2,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-12-01T17:53:35.083Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/omnedia.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,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2024-08-20T13:42:22.000Z","updated_at":"2025-11-29T17:09:44.000Z","dependencies_parsed_at":"2025-04-15T02:44:11.273Z","dependency_job_id":"3008fe42-f834-4072-8999-b46683f1a5b4","html_url":"https://github.com/omnedia/ngx-starry-sky","commit_stats":null,"previous_names":["omnedia/ngx-starry-sky"],"tags_count":15,"template":false,"template_full_name":null,"purl":"pkg:github/omnedia/ngx-starry-sky","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/omnedia%2Fngx-starry-sky","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/omnedia%2Fngx-starry-sky/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/omnedia%2Fngx-starry-sky/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/omnedia%2Fngx-starry-sky/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/omnedia","download_url":"https://codeload.github.com/omnedia/ngx-starry-sky/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/omnedia%2Fngx-starry-sky/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30176256,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-06T11:48:51.886Z","status":"ssl_error","status_checked_at":"2026-03-06T11:48:51.460Z","response_time":250,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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":[],"created_at":"2024-10-03T08:00:54.111Z","updated_at":"2026-03-06T12:32:50.796Z","avatar_url":"https://github.com/omnedia.png","language":"TypeScript","funding_links":[],"categories":["Recently Updated","Third Party Components"],"sub_categories":["[Oct 01, 2024](/content/2024/10/01/README.md)","Animations"],"readme":"# ngx-starry-sky\n\n\u003ca href=\"https://ngxui.com\" target=\"_blank\" style=\"display: flex;gap: .5rem;align-items: center;cursor: pointer; padding: 0 0 0 0; height: fit-content;\"\u003e\n  \u003cimg src=\"https://ngxui.com/assets/img/ngxui-logo.png\" style=\"width: 64px;height: 64px;\"\u003e\n\u003c/a\u003e\n\nThis Library is part of the NGXUI ecosystem. \u003cbr\u003e\nView all available components at https://ngxui.com\n\n`@omnedia/ngx-starry-sky` is an Angular library that creates a beautiful starry sky background with optional shooting star effects. This component is fully customizable, allowing you to adjust the density of stars, the behavior of shooting stars, and the overall appearance of the sky.\n\n## Features\n\n- Realistic starry sky background with twinkling stars.\n- Configurable shooting star effects, including speed, color, and frequency.\n- Fully customizable star density, twinkle behavior, and sky color.\n- Lightweight and easy to integrate as a standalone component.\n\n## Installation\n\nInstall the library using npm:\n\n```bash\nnpm install @omnedia/ngx-starry-sky\n```\n\n## Usage\n\nImport the `NgxStarrySkyComponent` in your Angular module or component:\n\n```typescript\nimport {NgxStarrySkyComponent} from '@omnedia/ngx-starry-sky';\n\n@Component({\n  ...\n    imports:\n[\n  ...\n    NgxStarrySkyComponent,\n],\n...\n})\n```\n\nUse the component in your template:\n\n```html\n\n\u003com-starry-sky\n  [skyColor]=\"'#0a0a0a'\"\n  [starsBackgroundConfig]=\"{\n    starDensity: 0.0002,\n    allStarsTwinkle: true,\n    twinkleProbability: 0.8\n  }\"\n  [shootingStarsConfig]=\"{\n    minSpeed: 15,\n    maxSpeed: 35,\n    starColor: '#FFFFFF',\n    trailColor: '#FF6347'\n  }\"\n  styleClass=\"custom-starry-sky\"\n\u003e\n  \u003ch1\u003eYour content here\u003c/h1\u003e\n\u003c/om-starry-sky\u003e\n```\n\n## API\n\n```html\n\n\u003com-starry-sky\n  [skyColor]=\"skyColor\"\n  [starsBackgroundConfig]=\"starsBackgroundConfig\"\n  [shootingStarsConfig]=\"shootingStarsConfig\"\n  [disableShootingStars]=\"disableShootingStars\"\n  styleClass=\"your-custom-class\"\n\u003e\n  \u003cng-content\u003e\u003c/ng-content\u003e\n\u003c/om-starry-sky\u003e\n```\n\n- `skyColor` (optional): The background color of the sky. Accepts any valid CSS color value.\n- `starsBackgroundConfig` (optional): Configuration object for the starry background, including star density, twinkle behavior, and twinkle speed.\n- `shootingStarsConfig` (optional): Configuration object for the shooting stars, including speed, color, and frequency.\n- `disableShootingStars` (optional): A boolean to enable or disable shooting stars. Defaults to false.\n- `styleClass` (optional): A custom CSS class to apply to the starry sky container.\n\n## Configuration Options\n\n### `starsBackgroundConfig`\n\n- `starDensity`: The density of stars in the sky, affecting how many stars are rendered. Defaults to 0.00015.\n- `allStarsTwinkle`: A boolean to enable or disable twinkling for all stars. Defaults to true.\n- `twinkleProbability`: The probability that a star will twinkle if allStarsTwinkle is false. Defaults to 0.7.\n- `minTwinkleSpeed`: The minimum speed of the twinkling effect. Defaults to 0.5.\n- `maxTwinkleSpeed`: The maximum speed of the twinkling effect. Defaults to 1.\n\n### `shootingStarsConfig`\n\n- `minSpeed`: The minimum speed of the shooting stars. Defaults to 10.\n- `maxSpeed`: The maximum speed of the shooting stars. Defaults to 30.\n- `minDelay`: The minimum delay between shooting stars in milliseconds. Defaults to 1200ms.\n- `maxDelay`: The maximum delay between shooting stars in milliseconds. Defaults to 4200ms.\n- `starColor`: The color of the shooting stars. Defaults to #cd8ef8.\n- `trailColor`: The color of the trail left by the shooting stars. Defaults to #80dffa.\n- `starWidth`: The width of the shooting stars. Defaults to 10px.\n- `starHeight`: The height of the shooting stars. Defaults to 1px.\n\n## Example\n\n```html\n\n\u003com-starry-sky\n  [skyColor]=\"'#000022'\"\n  [starsBackgroundConfig]=\"{\n    starDensity: 0.00025,\n    twinkleProbability: 0.9,\n    minTwinkleSpeed: 0.3,\n    maxTwinkleSpeed: 0.7\n  }\"\n  [shootingStarsConfig]=\"{\n    minSpeed: 20,\n    maxSpeed: 40,\n    starColor: '#FFD700',\n    trailColor: '#FF4500'\n  }\"\n  styleClass=\"starry-sky-custom\"\n\u003e\n  \u003cdiv class=\"content\"\u003eMagical Night Sky\u003c/div\u003e\n\u003c/om-starry-sky\u003e\n```\n\nThis example creates a starry sky with higher star density, frequent twinkling, and golden shooting stars with a fiery trail.\n\n## Styling\n\nTo further customize the appearance of the starry sky or container, use the styleClass input to apply your own CSS classes.\n\n```css\n.starry-sky-custom {\n  position: relative;\n  height: 100vh;\n  background-color: #000022;\n}\n\n.content {\n  position: relative;\n  z-index: 1;\n  color: white;\n  text-align: center;\n  padding-top: 50px;\n}\n```\n\nThis will create a fullscreen starry sky with custom content displayed on top.\n\n## Contributing\n\nContributions are welcome. Please submit a pull request or open an issue to discuss your ideas.\n\n## License\n\nThis project is licensed under the MIT License.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fomnedia%2Fngx-starry-sky","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fomnedia%2Fngx-starry-sky","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fomnedia%2Fngx-starry-sky/lists"}