Aura

A GitHub Profile README builder that uses dynamic widgets to create the best-looking profiles on the platform. My profile is serves as an example.

---

🎨 Available Widgets

All widgets support style customization via URL parameters.

Text Widget

Display custom text as a styled image.

GET /widgets/text/flat?content={text}

Example:

https://aurabyalexryan.vercel.app/widgets/text/flat?content=This+is+a+text+widget+example&font=Exo&primary=%23d9e3f2&neutral=%230b2141

---

💬 Wise Widget (Quotes)

Display random quotes from your saved collection.

GET /widgets/wise/flat/{github_user_id}

Example:

https://aurabyalexryan.vercel.app/widgets/wise/flat/115376787?font=Exo&primary=%23d9e3f2&neutral=%230b2141

💾 Save your quotes: See below

---

🎧 Spotify Widget

Showcase your favorite songs.

GET /widgets/spotify/flat/{github_user_id}

Example:

https://aurabyalexryan.vercel.app/widgets/spotify/flat/115376787?font=Exo&primary=%23d9e3f2&neutral=%230b2141

💾 Save your songs: See below

---

🃏 Card Widget

Project or profile card with title, description, and tech stack.

GET /widgets/card/flat?title={title}&username={username}&description={desc}&tools={tools}&banner={url}

Parameters:

• title - Card title
• username - Author/owner name
• description - Short description
• tools - Space-separated tech stack (e.g., Go+MongoDB+React)
• banner - Banner image URL

Example:

https://aurabyalexryan.vercel.app/widgets/card/flat?title=Aura&username=alexrcore&description=Dynamic+widgets+API&tools=Go+MongoDB+TypeScript&banner=https://i.ibb.co/k5vfkMd/6.jpg&font=Exo&primary=%23d9e3f2&neutral=%230b2141

---

🎨 Styling

Apply these parameters to any widget via URL query string:

Layout

width=1000          # Width in pixels
height=50           # Height in pixels
padding=3           # Internal spacing
margin=5            # External spacing

Typography

font=Exo            # Font family (Exo, Poppins, Inter, Roboto)
base=30             # Base font size
weight=bold         # Font weight (bold, medium, light)

Alignment

align=center        # Horizontal (start, center, end)
valign=middle       # Vertical (top, middle, bottom)

Colors

primary=%23d9e3f2   # Main text/foreground color
secondary=%237f9fcf # Secondary text color
accent=%2313376c    # Highlight color
neutral=%230b2141   # Background color

Note: URL-encode hex colors (# becomes %23)

Full Example:

https://aurabyalexryan.vercel.app/widgets/text/flat?content=Styled+Text&font=Exo&base=40&weight=bold&align=center&primary=%23d9e3f2&neutral=%230b2141&padding=5

---

💾 Saving Widget Data

Some widgets (Spotify, Wise) need you to save data first. Authentication is done via GitHub tokens.

🔐 Authentication

Get your GitHub token:

1. Go to github.com/settings/tokens
2. Click "Generate new token (classic)"
3. Select scope: read:user only
4. Generate and copy the token

---

🎧 Save Spotify Songs

POST https://aurabyalexryan.vercel.app/widgets/spotify
Content-Type: application/json
Authorization: Bearer {your_github_token}

{
  "list": [
    {
      "title": "Song Title",
      "album": "Album Name",
      "artist": "Artist Name",
      "cover": "https://image-url.com/cover.jpg"
    }
  ]
}

---

💬 Save Wise Quotes

POST https://aurabyalexryan.vercel.app/widgets/wise
Content-Type: application/json
Authorization: Bearer {your_github_token}

{
  "list": [
    {
      "content": "Your quote text here",
      "person": "Quote Author"
    }
  ]
}

---

Examples

# Save Spotify data
curl -X POST https://aurabyalexryan.vercel.app/widgets/spotify \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer YOUR_TOKEN" \
  -d '{"list":[{"title":"Song","album":"Album","artist":"Artist","cover":"https://..."}]}'

# Save Wise quotes
curl -X POST https://aurabyalexryan.vercel.app/widgets/wise \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer YOUR_TOKEN" \
  -d '{"list":[{"content":"Quote text","person":"Author"}]}'

---

📝 Usage in GitHub README

<!-- Spotify Widget -->

![Spotify](https://aurabyalexryan.vercel.app/widgets/spotify/flat/YOUR_GITHUB_ID?font=Exo&primary=%23d9e3f2&neutral=%230b2141)

<!-- Wise Widget -->

![Quote](https://aurabyalexryan.vercel.app/widgets/wise/flat/YOUR_GITHUB_ID?font=Exo&primary=%23d9e3f2&neutral=%230b2141)

<!-- Card Widget -->

![Project](https://aurabyalexryan.vercel.app/widgets/card/flat?title=MyProject&username=myname&description=Cool+project&tools=React+Node&banner=https://...&font=Exo&primary=%23d9e3f2&neutral=%230b2141)

Finding your GitHub ID:

1. Go to https://api.github.com/users/YOUR_USERNAME
2. Look for the id field

---

🔒 Security Notes

• ✅ Revoke tokens at github.com/settings/tokens when done
• ✅ Only read:user scope needed
• ✅ Your user ID is derived from your token—can't be spoofed

---

Contrubtions

Contributions are welcome!

If you’d like to suggest a change or fix an issue, please open an issue first so we can discuss it together. Once it’s approved, feel free to start working on a pull request.

If you’re interested in solving an existing issue, leave a comment to get assigned.