Skip to content

Next

  • Projects
  • Groups
  • Snippets
  • Help
    • Loading...
    • Help
    • Support
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
GitLab FOSS
GitLab FOSS
  • Project overview
    • Project overview
    • Details
    • Activity
    • Releases
    • Cycle Analytics
    • Insights
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
    • Charts
    • Locked Files
  • Issues 0
    • Issues 0
    • List
    • Boards
    • Labels
    • Service Desk
    • Milestones
  • Merge Requests 0
    • Merge Requests 0
  • CI / CD
    • CI / CD
    • Pipelines
    • Jobs
    • Schedules
    • Charts
  • Security & Compliance
    • Security & Compliance
    • Dependency List
  • Packages
    • Packages
    • Container Registry
  • Snippets
    • Snippets
  • Members
    • Members
  • Collapse sidebar
  • Activity
  • Graph
  • Charts
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
  • GitLab.org
  • GitLab FOSSGitLab FOSS
  • Issues
  • #25701

Closed
Open
Opened Dec 14, 2016 by Taurie Davis@tauriedavis
  • Report abuse
  • New issue
Report abuse New issue

Standardize text colors

Proposal

For text color we should switch from grays to black (or white) with opacity. That will help us even more with increasing contrast and improving accessibility, no matter the background color. This “technique” is documented in Google's Material Design, but it's also being used by Medium (for example).

Hierarchy/Source Google Material Design Medium
Primary rgba(0,0,0,.87) (Passes AAA) rgba(0,0,0,.80) (Passes AAA) This is equal to #333 over white
Secondary rgba(0,0,0,.54) (Passes AA) rgba(0,0,0,.60) (Passes AA)
Tertiary rgba(0,0,0,.38) (Fails) rgba(0,0,0,.44) (Passes AA for large text)

Original Proposal

Currently our body text is quite light. We currently use #5c5c5c in most places for our body text. To increase contrast, we can make our body text darker. This would also help when screens are set to maximum brightness. Some suggestions for a new body text color are #333 and #444.

Screen_Shot_2016-12-14_at_12.44.34_PM

cc @cperessini @pedroms @awhildy

Related issues

  • Discussion
  • Designs
Assignee
Assign to
8.16
Milestone
8.16
Assign milestone
Time tracking
None
Due date
None
1
Labels
UX
Assign labels
  • View project labels
Reference: gitlab-org/gitlab-foss#25701