{"id":16763583,"url":"https://github.com/oti/smooth-gradient-sass-function","last_synced_at":"2025-10-07T13:20:31.428Z","repository":{"id":42396185,"uuid":"131805761","full_name":"oti/smooth-gradient-sass-function","owner":"oti","description":null,"archived":false,"fork":false,"pushed_at":"2023-07-07T22:27:38.000Z","size":1024,"stargazers_count":9,"open_issues_count":2,"forks_count":3,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-08-31T20:54:37.507Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"SCSS","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/oti.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE.txt","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},"funding":{"github":"oti"}},"created_at":"2018-05-02T06:07:58.000Z","updated_at":"2024-09-05T10:12:19.000Z","dependencies_parsed_at":"2025-01-22T22:39:54.153Z","dependency_job_id":null,"html_url":"https://github.com/oti/smooth-gradient-sass-function","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/oti/smooth-gradient-sass-function","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oti%2Fsmooth-gradient-sass-function","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oti%2Fsmooth-gradient-sass-function/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oti%2Fsmooth-gradient-sass-function/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oti%2Fsmooth-gradient-sass-function/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/oti","download_url":"https://codeload.github.com/oti/smooth-gradient-sass-function/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/oti%2Fsmooth-gradient-sass-function/sbom","scorecard":{"id":714297,"data":{"date":"2025-08-11","repo":{"name":"github.com/oti/smooth-gradient-sass-function","commit":"1a130c1b1669c400243ad4ba7fd75e40904fe75e"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":1.7,"checks":[{"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":"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":"Code-Review","score":0,"reason":"Found 0/26 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":"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":"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":"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":"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.txt:0","Info: FSF or OSI recognized license: MIT License: LICENSE.txt: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 'main'"],"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"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 4 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":0,"reason":"11 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-xq7p-g2vc-g82p","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-4gmj-3p3h-gm8h","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-7hpj-7hhx-2fgx","Warn: Project is vulnerable to: GHSA-mwcw-c2x4-8c55","Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j","Warn: Project is vulnerable to: GHSA-3965-hpx2-q597","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-22T09:06:55.932Z","repository_id":42396185,"created_at":"2025-08-22T09:06:55.932Z","updated_at":"2025-08-22T09:06:55.932Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278780639,"owners_count":26044592,"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-07T02:00:06.786Z","response_time":59,"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":[],"created_at":"2024-10-13T05:07:00.676Z","updated_at":"2025-10-07T13:20:31.392Z","avatar_url":"https://github.com/oti.png","language":"SCSS","funding_links":["https://github.com/sponsors/oti"],"categories":[],"sub_categories":[],"readme":"# Smooth Gradient Sass Function\n\n\u003chttps://smooth-gradient-sass-function.dskd.jp/\u003e\n\nInspired by [Naoki Matsuda's Pen](https://codepen.io/readymadegogo/pen/pPLJgR) \u0026 [Lukas Hermann's Pen](https://codepen.io/lhermann/pen/qmpMGQ).\n\n[![Netlify Status](https://api.netlify.com/api/v1/badges/1e62fa99-883c-46bc-8bb2-948a81953597/deploy-status)](https://app.netlify.com/sites/smooth-gradient-sass-function/deploys)\n\n- **v3.x is compatible to dart-sass.**\n- [v2.x](https://github.com/oti/smooth-gradient-sass-function/tree/v2.1.0) is compatible to libsass(node-sass).\n\n## You can get smooth gradient sass function\n\nGradients are scrim, easeOutSine, and clothoid curve.\n\n```scss\n// `scrim` smoothing\n@function scrim($color: #000000, $opacity: 1, $start: 0, $end: 100%) {\n  // validate arguments\n  // ...\n\n  $scrim: (\n    1: 0,\n    0.738: 0.19,\n    0.541: 0.34,\n    0.382: 0.47,\n    0.278: 0.565,\n    0.194: 0.65,\n    0.126: 0.73,\n    0.075: 0.802,\n    0.042: 0.861,\n    0.021: 0.91,\n    0.008: 0.952,\n    0.002: 0.982,\n    0: 1,\n  );\n  @return _make-gradient-list($scrim, $color, $opacity, $start, $end);\n}\n\n@function _make-gradient-list($map, $color, $opacity, $start, $end) {\n  $color-stops: ();\n  @each $key, $mod in $map {\n    $position: $mod * ($end - $start) + $start;\n    $new-stop: color.change($color, $alpha: $key * $opacity);\n    $color-stops: list.append($color-stops, $new-stop $position, \"comma\");\n  }\n  @return $color-stops;\n}\n```\n\n```scss\n// `easeOutSine` smoothing\n@function easeOutSine($color: #000000, $opacity: 1, $start: 0, $end: 100%) {\n  // validate arguments\n  // ...\n\n  $easeOutSine: (\n    1: 0,\n    0.917: 0.053,\n    0.834: 0.106,\n    0.753: 0.159,\n    0.672: 0.213,\n    0.591: 0.268,\n    0.511: 0.325,\n    0.433: 0.384,\n    0.357: 0.445,\n    0.283: 0.509,\n    0.213: 0.577,\n    0.147: 0.65,\n    0.089: 0.729,\n    0.042: 0.814,\n    0.011: 0.906,\n    0: 1,\n  );\n  @return _make-gradient-list($easeOutSine, $color, $opacity, $start, $end);\n}\n```\n\n```scss\n// `clothoid` smoothing\n@function clothoid($color: #000000, $opacity: 1, $start: 0, $end: 100%) {\n  // validate arguments\n  // ...\n\n  $clothoid: (\n    1: 0,\n    0.3: 0.5,\n    0.15: 0.65,\n    0.075: 0.755,\n    0.037: 0.8285,\n    0.019: 0.88,\n    0: 1,\n  );\n  @return _make-gradient-list($clothoid, $color, $opacity, $start, $end);\n}\n```\n\n## Usage\n\n### from git\n\n1. git clone and move to your project.\n\n```bash\ngit clone git@github.com:oti/smooth-gradient-sass-function.git\nmv smooth-gradient-sass-function/src/_smooth-gradient.scss your/project/scss/path\n```\n\n2. `@use` in your .scss file.\n\n```scss\n@use \"your/project/scss/path/smooth-gradient\" as gradients;\n```\n\n### from npm\n\n1. npm install.\n\n```shell\nnpm i smooth-gradient-sass-function\n```\n\n2. `@use` in your .scss file.\n\n```scss\n@use \"../(to project root)/node_modules/smooth-gradient-sass-function\" as gradients;\n```\n\n### write function\n\n3. write `gradients.scrim()` sass function and argument in argument of native `linear-gradient()` function.\n\n```scss\n.elem {\n  // default color is `#000`, start opacity is `1`\n  background-image: linear-gradient(to bottom, gradients.scrim());\n}\n```\n\n## Any angel, Any color, Any opacity\n\n```scss\n.box {\n  // start left\n  background-image: linear-gradient(to right, gradients.scrim());\n}\n```\n\n```scss\n.box {\n  // start left bottom\n  background-image: linear-gradient(45deg, gradients.scrim());\n}\n```\n\n```scss\n.box {\n  // 1st arg is start color code(default: #000)\n  background-image: linear-gradient(to bottom, gradients.scrim(#ff0000));\n}\n```\n\n```scss\n.box {\n  // 2nd arg is start opacity(default: 1)\n  background-image: linear-gradient(to bottom, gradients.scrim(#ffff00, 0.5));\n}\n```\n\n```scss\n.box {\n  // 3rd arg is start position\n  background-image: linear-gradient(\n    to bottom,\n    gradients.scrim(#ffff00, 0.5, $start: 50%)\n  );\n}\n```\n\n```scss\n.box {\n  // 4th arg is end position\n  background-image: linear-gradient(\n    to bottom,\n    gradients.scrim(#ffff00, 0.5, $start: 0, $end: 16em)\n  );\n}\n```\n\n## LICENSE\n\n[MIT license Copyright (c) 2018 oti](LICENSE.txt)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foti%2Fsmooth-gradient-sass-function","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Foti%2Fsmooth-gradient-sass-function","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Foti%2Fsmooth-gradient-sass-function/lists"}