Skip to content

New mode: Color picker #8

@pgivel

Description

@pgivel

Summary

Add a color picker mode that samples the pixel color under the cursor and drops an annotation with hex and RGB values.

Use case

Quick color checks during UI validation: "Is this the right brand color?", "Do these two elements use the same color?". Keeps the tool in-scope as a screen measurement utility — color is just another property to measure.

Interaction

  1. User selects color picker mode (keyboard shortcut, e.g. 5).
  2. Cursor shows a small live preview swatch of the color under the pointer.
  3. Click places a color annotation at that point.
  4. The annotation displays:
    • A color swatch (small filled rectangle)
    • Hex value: #FF5722
    • RGB value: rgb(255, 87, 34)

Implementation notes

  • The screenshot QImage is already available in RulerBackend. Use QImage.pixelColor(x, y) to sample.
  • Expose a @pyqtSlot like sampleColorAtPoint(x, y) returning hex/RGB strings (or a structured object).
  • QML: small swatch rectangle + text label, positioned near cursor. Reuse MeasurementLabel layout patterns.
  • In session mode (Session mode: persistent annotations, measurement export & composite screenshot #6), clicking places a persistent color annotation.
  • In quick mode, clicking copies the color string to clipboard and quits.

Future extensions (out of scope for this issue)

  • Comparing two picked colors: show WCAG contrast ratio, ΔE color distance.
  • Average color over a small region (e.g. 3×3 or 5×5 around cursor) to reduce single-pixel noise.
  • Linking two color annotations to highlight match/mismatch.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions