Skip to content

[BUG] Poor text contrast on "Start Finding Projects" CTA button β€” text hard to read on yellow backgroundΒ #836

@shaarvitripathi2-dotcom

Description

πŸ› Bug Report

Describe the bug
The primary CTA button "Start Finding Projects" on the homepage has poor text contrast. The current text color is var(--indigo-900) (resolves to #0f1560 β€” a dark navy blue) on the bright yellow (#fbbf24) background, making it difficult to read β€” especially in bright environments or for users with visual impairments.

This is an accessibility (WCAG contrast) issue as well as a general UX concern.

Steps to reproduce

  1. Visit https://mydevpath-github.vercel.app/
  2. Look at the "Start Finding Projects" button in the hero section

Expected behavior
Button text should be clearly legible. Changing the text color to #000000 (black) on the yellow background gives a contrast ratio well above the WCAG AA minimum of 4.5:1, making it easy to read.

Image

Current behavior
The text inside the button is difficult to read against the yellow background due to the dark navy color blending into the bright yellow.

Suggested fix
In static/style.css, find the .btn-hero-primary selector and update the color property:

/* Before */
.btn-hero-primary {
  color: var(--indigo-900);  /* resolves to #0f1560 β€” dark navy, low readability on yellow */
}

/* After */
.btn-hero-primary {
  color: #000000;
}

Environment

  • Browser: Microsoft Edge (Chromium)
  • OS: Windows 11
  • Page: Homepage hero section (/)

GSSoC 2026
@komalharshita
I would like to work on this issue. Please assign it to me.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions