{"id":15585647,"url":"https://github.com/igorkasyanchuk/avatarro","last_synced_at":"2025-04-15T11:08:03.417Z","repository":{"id":41097047,"uuid":"382045921","full_name":"igorkasyanchuk/avatarro","owner":"igorkasyanchuk","description":"Generate google-style avatars in your application","archived":false,"fork":false,"pushed_at":"2023-02-28T13:18:44.000Z","size":191,"stargazers_count":38,"open_issues_count":1,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-03T08:22:15.551Z","etag":null,"topics":["avatar","rails","ruby"],"latest_commit_sha":null,"homepage":"https://railsjazz.com/","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/igorkasyanchuk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"MIT-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}},"created_at":"2021-07-01T13:40:39.000Z","updated_at":"2025-02-11T21:35:21.000Z","dependencies_parsed_at":"2024-04-12T12:33:18.855Z","dependency_job_id":"1212c110-49d4-43f0-a216-8d9e38690870","html_url":"https://github.com/igorkasyanchuk/avatarro","commit_stats":{"total_commits":12,"total_committers":1,"mean_commits":12.0,"dds":0.0,"last_synced_commit":"268292c97bc2e2eb995d20ccc37ed378d7054265"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igorkasyanchuk%2Favatarro","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igorkasyanchuk%2Favatarro/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igorkasyanchuk%2Favatarro/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/igorkasyanchuk%2Favatarro/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/igorkasyanchuk","download_url":"https://codeload.github.com/igorkasyanchuk/avatarro/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248506128,"owners_count":21115387,"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":["avatar","rails","ruby"],"created_at":"2024-10-02T21:02:20.496Z","updated_at":"2025-04-15T11:08:03.391Z","avatar_url":"https://github.com/igorkasyanchuk.png","language":"Ruby","funding_links":["https://www.patreon.com/igorkasyanchuk"],"categories":[],"sub_categories":[],"readme":"# Avatarro\n\n[![RailsJazz](https://github.com/igorkasyanchuk/rails_time_travel/blob/main/docs/my_other.svg?raw=true)](https://www.railsjazz.com)\n[![https://www.patreon.com/igorkasyanchuk](https://github.com/igorkasyanchuk/rails_time_travel/blob/main/docs/patron.svg?raw=true)](https://www.patreon.com/igorkasyanchuk)\n[![Listed on OpenSource-Heroes.com](https://opensource-heroes.com/badge-v1.svg)](https://opensource-heroes.com/r/igorkasyanchuk/avatarro)\n\nGoogle-style avatar generator for your app. \n\nThis gem generates SVG which can be used inside your HTML or img(src) to display google-style avatar with initials.\n\nSample:\n\n[\u003cimg src=\"https://github.com/igorkasyanchuk/avatarro/blob/main/docs/avataro.png?raw=true\"\n/\u003e](https://github.com/igorkasyanchuk/avatarro/blob/main/docs/avataro.png?raw=true)\n\n## Usage\n\nYou can generate avatar using 2 methods, depending how you need to use it. Using `Avatarro.svg` method to embed svg inside HTML or `Avatarro.image` method to generate Base64 image use with image_tag.\n\n```erb\n  \u003c%= image_tag Avatarro.image(current_user.full_name), size: '24x24' %\u003e\n  \u003c%= image_tag Avatarro.image(\"Igor Kasyanchuk\", solid: true), size: '24x24' %\u003e\n  \u003c%= image_tag Avatarro.image(\"IK\"), size: '32x32' %\u003e\n  \u003c%= raw Avatarro.svg(\"IK\") %\u003e\n  \u003c%= image_tag Avatarro.image(current_user.full_name, random: true, solid: true), size: '20x20', style: 'margin-right: 5px; border-radius: 50%' %\u003e\n```\n\nIt you need rounded avatars just add CSS to the img.\n\n```erb\n\u003c%= image_tag Avatarro.image(\"IK\"), size: '32x32', style: 'border-radius: 50%' %\u003e\n```\n\nMore samples (shown on screenshot above):\n\n```erb\n\u003cdiv class=\"card\"\u003e\n  \u003ch3\u003eAvatar Generator for the\u003cbr\u003eAPP\u003c/h3\u003e\n  \u003cdiv class=\"people round\"\u003e\n    \u003c%= image_tag Avatarro.image(\"OI\"), size: '16x16' %\u003e\n    \u003c%= image_tag Avatarro.image(\"JS\"), size: '16x16' %\u003e\n    \u003c%= image_tag Avatarro.image(\"MK\"), size: '16x16' %\u003e\n    \u003c%= image_tag Avatarro.image(\"ZP\"), size: '16x16' %\u003e\n  \u003c/div\u003e\n\u003c/div\u003e\n\n\u003cdiv class=\"card\"\u003e\n  \u003ch3\u003eGenerates SVG for the html\u003c/h3\u003e\n  \u003cdiv class=\"people round\"\u003e\n    \u003c%= image_tag Avatarro.image(\"OI\", solid: true), size: '24x24' %\u003e\n    \u003c%= image_tag Avatarro.image(\"JS\", solid: true), size: '24x24' %\u003e\n    \u003c%= image_tag Avatarro.image(\"MK\", solid: true), size: '24x24' %\u003e\n    \u003c%= image_tag Avatarro.image(\"ZP\", solid: true), size: '24x24' %\u003e\n    \u003c%= image_tag Avatarro.image(\"😁\", solid: true), size: '24x24' %\u003e\n    \u003c%= image_tag Avatarro.image(\"😂\", solid: true), size: '24x24' %\u003e\n  \u003c/div\u003e\n\u003c/div\u003e\n\n\u003cdiv class=\"card\"\u003e\n  \u003ch3\u003eOr can be used as\u003cbr\u003e img src=\"...\"\u003c/h3\u003e\n  \u003cdiv class=\"people\"\u003e\n    \u003c%= image_tag Avatarro.image(\"ZO\", random: true), size: '32x32' %\u003e\n    \u003c%= image_tag Avatarro.image(\"AB\", random: true), size: '32x32' %\u003e\n    \u003c%= image_tag Avatarro.image(\"ФЯ\", random: true), size: '32x32' %\u003e\n    \u003c%= image_tag Avatarro.image(\"DA\", random: true), size: '32x32' %\u003e\n  \u003c/div\u003e\n\u003c/div\u003e\n\n\u003cdiv class=\"clear\"\u003e\u003c/div\u003e\n\n\u003cdiv class=\"card\"\u003e\n  \u003c%= raw Avatarro.svg(\"IK\") %\u003e\n  \u003c%= raw Avatarro.svg(\"WS\") %\u003e\n  \u003c%= raw Avatarro.svg(\"AP\") %\u003e\n  \u003chr\u003e\n  \u003c%= image_tag Avatarro.image(\"WW\") %\u003e\n  \u003c%= image_tag Avatarro.image(\"OI\", random: true) %\u003e\n  \u003c%= image_tag Avatarro.image(\"ZA\"), style: 'border-radius: 50%', size: '32x32' %\u003e\n  \u003c%= image_tag Avatarro.image(\"OZ\", random: true), style: 'border-radius: 50%', size: '16x16' %\u003e\n\u003c/div\u003e\n\n\n\u003cdiv class=\"card\"\u003e\n  \u003c%= image_tag Avatarro.image(\"WA\", random: true, width: 300, height: 300) %\u003e\n\u003c/div\u003e\n\n\u003cdiv class=\"card\"\u003e\n  \u003c%= image_tag Avatarro.image(\"⚡\", random: true, width: 300, height: 300) %\u003e\n\u003c/div\u003e\n```\n\n## Configuration\n\nExample of the possible options (see args hash):\n\n```ruby\n  def Avatarro.template(initials, args = {})\n    data        = args[:random] ? GRADIENTS.sample : GRADIENTS[index(initials) % GRADIENTS.size]\n    start       = args[:start].presence || data[0]\n    finish      = args[:solid] ? data[0] : (args[:finish].presence || data[1])\n    degree      = args[:degree].presence || data[2].presence || 90\n    color       = args[:color].presence || data[3].presence || '#FFF'\n    width       = args[:width].presence || 64\n    height      = args[:height].presence || 64\n```\n\nFor example:\n\n```erb\n  \u003c%= image_tag Avatarro.image(\"WA\", random: true, width: 300, height: 300, color: 'red') %\u003e\n```\n\n## Installation\nAdd this line to your application's Gemfile:\n\n```ruby\ngem 'avatarro'\n```\n\nAnd then execute:\n```bash\n$ bundle\n```\n\nOr install it yourself as:\n```bash\n$ gem install avatarro\n```\n\n## Contributing\nContribution directions go here.\n\n## TODO\n\n- CI\n- better graphics and more gradients\n- radial gradient\n\n## Credits\n\nThe idea of this gem came after reading an article: https://kukicola.io/posts/creating-google-like-letter-avatars-using-erb-generated-svgs/. We actually did something similar with HTML/CSS on our project too, but with SVG solution looks just better.\n\n## License\nThe gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).\n\n[\u003cimg src=\"https://github.com/igorkasyanchuk/rails_time_travel/blob/main/docs/more_gems.png?raw=true\"\n/\u003e](https://www.railsjazz.com/?utm_source=github\u0026utm_medium=bottom\u0026utm_campaign=avatarro)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Figorkasyanchuk%2Favatarro","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Figorkasyanchuk%2Favatarro","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Figorkasyanchuk%2Favatarro/lists"}