Fix pink color selection by adding intermediate hue gradient stops

[Copilot]

Pink colors (hue 300-360°) were difficult to select because hue gradients had only 7 color stops, compressing the magenta-to-red transition into 1/6 of the slider.

Changes

• Increased hue gradient stops from 7 to 13 (every 30° instead of 60°)
• Added explicit color stops at 30°, 90°, 150°, 210°, 270°, and 330° (pink)
• Applied to all pickers: PaletteHuePicker, HSVPicker, PaletteSaturationPicker, PaletteValuePicker, WheelPicker

With 13 evenly distributed stops, gradient positions align perfectly with hue values (position N/12 = hue N×30/360), enabling precise selection across the full hue spectrum.

Before: 7 stops → pink range compressed into last 16.67% of slider
After: 13 stops → pink explicitly represented at position 11/12 (91.67%)

// Before
List<Color> get hueColors => <Color>[
  color.withHue(0.0).toColor(),    // Red
  color.withHue(60.0).toColor(),   // Yellow
  color.withHue(120.0).toColor(),  // Green
  color.withHue(180.0).toColor(),  // Cyan
  color.withHue(240.0).toColor(),  // Blue
  color.withHue(300.0).toColor(),  // Magenta
  color.withHue(0.0).toColor()     // Red (gap from magenta to red)
];

// After
List<Color> get hueColors => <Color>[
  color.withHue(0.0).toColor(),    // Red
  color.withHue(30.0).toColor(),   // Orange
  color.withHue(60.0).toColor(),   // Yellow
  color.withHue(90.0).toColor(),   // Chartreuse
  color.withHue(120.0).toColor(),  // Green
  color.withHue(150.0).toColor(),  // Spring Green
  color.withHue(180.0).toColor(),  // Cyan
  color.withHue(210.0).toColor(),  // Azure
  color.withHue(240.0).toColor(),  // Blue
  color.withHue(270.0).toColor(),  // Violet
  color.withHue(300.0).toColor(),  // Magenta
  color.withHue(330.0).toColor(),  // Pink ← explicit pink stop
  color.withHue(0.0).toColor()     // Red
];

Original prompt

---

This section details on the original issue you should resolve

<issue_title>[Bug report] : there is no option to choose Pink color from palette</issue_title>
<issue_description>### Version

1.5.0

Platforms

dart, Android, iOS

Device Model

iPhone Android

flutter info

Last login: Mon Apr  8 00:01:50 on ttys002
apple@MacBook-Pro-2 ~ % flutter doctor -v
[✓] Flutter (Channel stable, 3.19.5, on macOS 14.4 23E214 darwin-x64, locale
    en-GB)
    • Flutter version 3.19.5 on channel stable at
      /Users/apple/Documents/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 300451adae (11 days ago), 2024-03-27 21:54:07 -0500
    • Engine revision e76c956498
    • Dart version 3.3.3
    • DevTools version 2.31.1

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/apple/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Applications/Android
      Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      17.0.7+0-17.0.7b1000.6-10550314)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15E204a
    • CocoaPods version 1.15.0

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build
      17.0.7+0-17.0.7b1000.6-10550314)

[✓] VS Code (version 1.87.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.84.0

[✓] Connected device (3 available)
    • sdk gphone64 x86 64 (mobile) • emulator-5554 • android-x64    • Android 13 (API 33) (emulator)
    • macOS (desktop)              • macos         • darwin-x64     • macOS 14.4 23E214 darwin-x64
    • Chrome (web)                 • chrome        • web-javascript • Google Chrome 123.0.6312.107
    ! Error: Browsing on the local area network for iPhone. Ensure the device is unlocked and attached with a cable or associated with the same local area network as this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources
    • All expected network resources are available.

• No issues found!

How to reproduce?

Try to drag the cursor at end of palette and choose pink color, ending point is having purple color instead of Pink one..

Logs

No response

Example code (optional)

class _ColorPickerWidgetState extends State<ColorPickerWidget> {
  // Color
  late Color _color;
  late HSVColor _hSVColor;

  void _hSVColorOnChanged(HSVColor value) {
    _updateColor(value.toColor().withAlpha(_color.alpha));
  }

  void _updateColor(Color color) {
    _color = color;
    _hSVColor = HSVColor.fromColor(color);
    widget.onChanged(color);
  }

  @override
  void initState() {
    super.initState();

    _color = widget.color;
    _hSVColor = HSVColor.fromColor(_color);
  }

  @override
  Widget build(BuildContext context) {
    return PaletteHuePicker(
      color: _hSVColor,
      paletteHeight: widget.paletteHeight ?? 280,
      hueHeight: 10,
      onChanged: (HSVColor value) => super.setState(
        () => _hSVColorOnChanged(value),
      ),
    );
  }
}

Contact

[email protected]</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes [Bug report] : there is no option to choose Pink color from palette #45

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

[Copilot]

Pull request overview

This PR fixes a color selection issue where pink colors (hue 300-360°) were difficult to select in color pickers due to insufficient gradient granularity. The fix increases hue gradient stops from 7 to 13, providing stops every 30° instead of 60°.

Key Changes:

• Added 6 new intermediate hue color stops at 30°, 90°, 150°, 210°, 270°, and 330° (pink)
• Updated gradient stops with mathematically accurate RGB values for each hue angle
• Applied changes consistently across all 5 picker components

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
lib/src/pickers/wheel_picker.dart	Added 6 new hue color stops to the sweep gradient used in the wheel picker
lib/src/pickers/palette_value_picker.dart	Added 6 new hue color stops to the hardcoded hueColors list
lib/src/pickers/palette_saturation_picker.dart	Added 6 new hue color stops to the hardcoded hueColors list
lib/src/pickers/palette_hue_picker.dart	Added 6 new hue color stops using dynamic color generation with withHue() method
lib/src/pickers/hsv_picker.dart	Added 6 new hue color stops using dynamic color generation with withHue() method

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.