Skip to content

[PF] Remove legacy image-rendering from Avatar - #5098

Open
azebich wants to merge 1 commit into
masterfrom
pf-avatar-image-optimization
Open

[PF] Remove legacy image-rendering from Avatar#5098
azebich wants to merge 1 commit into
masterfrom
pf-avatar-image-optimization

Conversation

@azebich

@azebich azebich commented Sep 1, 2026

Copy link
Copy Markdown
Contributor

Description

Removes the [image-rendering:-webkit-optimize-contrast] arbitrary class from ImageAvatar.

It was a hack for a long-fixed Chrome bug with blurry downscaled images. Chrome now aliases -webkit-optimize-contrast to crisp-edges, which forces low-quality (nearest-neighbor-style) scaling — the opposite of its original intent. With it removed, avatar photos use the browser's default high-quality resampling.

Jest snapshots for AccountSelect and PageTopBarMenu updated (they embed the avatar class list).

How to test

  • Temploy
  • Open Avatar stories with photo sources — downscaled photos should look slightly smoother, no other changes
  • Review the Happo report: only avatar-bearing snapshots re-render, with minor edge/sharpness diffs on the photos (intended)

Screenshots

Before. After.
See Happo report See Happo report

Development checks

  • Add changeset according to guidelines (if needed)
  • Double check if picasso-tailwind-merge requires major update (check its README.md)
  • Read CONTRIBUTING.md and Component API principles
  • Make sure that additions and changes on the design follow Toptal's BASE design, and it's been already discussed with designers at #-base-core
  • Annotate all props in component with documentation
  • Create examples for component
  • Ensure that deployed demo has expected results and good examples
  • Ensure the changed/created components have not caused accessibility issues. How to use accessibility plugin in storybook.
  • Self reviewed
  • Covered with tests (visual tests included)

@azebich azebich self-assigned this Sep 1, 2026
@azebich
azebich requested a review from a team as a code owner September 1, 2026 08:13
@azebich azebich added the no-jira label Sep 1, 2026
@changeset-bot

changeset-bot Bot commented Sep 1, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: f246e51

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 15 packages
Name Type
@toptal/picasso-avatar Patch
@toptal/picasso Patch
@toptal/picasso-avatar-upload Patch
@toptal/picasso-menu Patch
@toptal/picasso-page Patch
@toptal/picasso-user-badge Patch
@toptal/picasso-forms Patch
@toptal/picasso-account-select Patch
@toptal/picasso-autocomplete Patch
@toptal/picasso-select Patch
@toptal/picasso-tabs Patch
@toptal/picasso-tagselector Patch
@toptal/picasso-query-builder Patch
@toptal/picasso-rich-text-editor Patch
@toptal/picasso-date-select Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions

github-actions Bot commented Sep 1, 2026

Copy link
Copy Markdown
Contributor

📖 Storybook Preview

🚀 Your Storybook preview is ready: View Storybook

📍 Preview URL: https://toptal.github.io/picasso/prs/5098/

This preview is updated automatically when you push changes to this PR.

github-actions Bot added a commit that referenced this pull request Sep 1, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant