Color loupe

A color loupe shows the output color that would otherwise be covered by a cursor, stylus, or finger during color selection.

{
  "slug": "color-loupe",
  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/component.json",
  "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/components/color-loupe.json",
  "title": "Color loupe",
  "description": "A color loupe shows the output color that would otherwise be covered by a cursor, stylus, or finger during color selection.",
  "meta": {
    "category": "feedback",
    "documentationUrl": "https://spectrum.adobe.com/page/color-loupe/"
  },
  "type": "object",
  "properties": {
    "value": {
      "$id": "https://opensource.adobe.com/spectrum-design-data/schemas/types/hex-color.json",
      "title": "hex-color",
      "description": "Hexadecimal color code",
      "type": "string",
      "pattern": "/^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/"
    },
    "state": {
      "type": "string",
      "enum": [
        "default"
      ],
      "default": "default"
    }
  }
}