Skip to content

[vector_graphics_compiler] Fix HSL color parsing for decimal percentage components#11619

Open
fondoger wants to merge 2 commits intoflutter:mainfrom
fondoger:fix-hsl-decimal-percentage-parsing
Open

[vector_graphics_compiler] Fix HSL color parsing for decimal percentage components#11619
fondoger wants to merge 2 commits intoflutter:mainfrom
fondoger:fix-hsl-decimal-percentage-parsing

Conversation

@fondoger
Copy link
Copy Markdown

Description

Fixes a bug in the HSL color parser where decimal percentage components
(e.g. 76.2745098039%) were incorrectly multiplied by 2.55 — the
conversion factor used for rgb percentages (percent → 0–255). For
hsl, saturation and lightness must stay in the 0–100 range (later
divided by 100) so the multiplication produced wildly wrong values
(e.g. 76.27 → 194, then 194 / 100 = 1.94).

The same branch also mis-handled the hsla alpha component: a unitless
decimal like 0.5 should be converted to 0–255 via × 255, not × 2.55.

Root cause

parser.dart checked rawColor.contains('.') and unconditionally
applied * 2.55, regardless of whether the current function was
rgb()/rgba() (correct) or hsl()/hsla() (incorrect).

Fix

Track whether each token had a % suffix before stripping it.
For HSL percentage components, return the raw double (0–100 range).
For unitless alpha decimals (0–1 range), multiply by 255.

Reproduction (from issue #185833)

hsl(270, 100%, 76.2745098039%)
Before fix After fix
#efdeff #c286ff

Tests

Four new tests added to parsers_test.dart:

  • hsl with integer percentages (regression)
  • hsl with decimal lightness percentage (the reported bug)
  • hsla with integer percentages + decimal alpha (regression)
  • hsla with decimal lightness + decimal alpha (combined case)

Related Issues

Fixes flutter/flutter#185833

@github-actions github-actions Bot added p: vector_graphics triage-engine Should be looked at in engine triage labels Apr 30, 2026
@google-cla
Copy link
Copy Markdown

google-cla Bot commented Apr 30, 2026

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.

Copy link
Copy Markdown

@gemini-code-assist gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request updates the SVG parser to correctly handle HSL and HSLA color strings, specifically addressing issues with decimal percentages in lightness and decimal values in alpha channels. It changes the internal storage of color components to num to preserve precision during parsing and adds comprehensive tests for various HSL/HSLA formats. I have no feedback to provide.

…ge components

Decimal percentage tokens in hsl()/hsla() were incorrectly multiplied
by 2.55 (the rgb % → 0-255 factor), causing wrong saturation/lightness
values (e.g. 76.27% → 194 instead of 76.27) and therefore wrong colors.
Non-percentage alpha decimals (0–1) were also affected.

Fix: track whether each token had a '%' suffix; for HSL percentage
components return the raw float (0–100), and for unitless alpha
decimals multiply by 255 instead of 2.55.

Fixes: flutter/flutter#185833
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

p: vector_graphics triage-engine Should be looked at in engine triage

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[flutter_svg] HSL to RGB conversion incorrect due to percentage parsing

1 participant