Improve tray icon visibility: Claude orange, full opacity, larger size
Starburst was nearly invisible at tray icon size due to white color at 50% alpha on a 128px canvas. Now renders in Claude brand orange (#E07B53) at full opacity on a 256px canvas with proportionally scaled geometry. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -4,10 +4,12 @@ import math
|
||||
|
||||
from PIL import Image, ImageDraw
|
||||
|
||||
SIZE = 128
|
||||
SIZE = 256
|
||||
CENTER = SIZE // 2
|
||||
ARC_WIDTH = 16
|
||||
ARC_RADIUS = (SIZE - ARC_WIDTH) // 2 # inner edge of arc
|
||||
ARC_WIDTH = 28
|
||||
|
||||
# Claude brand orange
|
||||
_CLAUDE_ORANGE = (224, 123, 83) # #E07B53
|
||||
|
||||
# Color thresholds for the usage arc (10% increments)
|
||||
_COLORS = [
|
||||
@@ -37,26 +39,26 @@ def _arc_color(pct):
|
||||
|
||||
|
||||
def _draw_starburst(img):
|
||||
"""Draw 8-petal starburst logo at 50% opacity."""
|
||||
"""Draw 8-petal starburst logo in Claude orange, full opacity."""
|
||||
layer = Image.new("RGBA", (SIZE, SIZE), (0, 0, 0, 0))
|
||||
draw = ImageDraw.Draw(layer)
|
||||
|
||||
color = (*_CLAUDE_ORANGE, 255)
|
||||
|
||||
num_petals = 8
|
||||
# Petal geometry: elongated ellipse approximated as polygon
|
||||
petal_length = 38
|
||||
petal_width = 10
|
||||
petal_length = SIZE * 0.38 # fill most of the icon
|
||||
petal_width = SIZE * 0.10
|
||||
|
||||
for i in range(num_petals):
|
||||
angle = math.radians(i * (360 / num_petals))
|
||||
|
||||
# Build petal as 4-point diamond shape
|
||||
# Tip of petal (far from center)
|
||||
tip_x = CENTER + math.cos(angle) * petal_length
|
||||
tip_y = CENTER + math.sin(angle) * petal_length
|
||||
|
||||
# Base points (perpendicular to petal direction, near center)
|
||||
perp = angle + math.pi / 2
|
||||
base_offset = 6 # distance from center to base of petal
|
||||
base_offset = SIZE * 0.05
|
||||
bx = CENTER + math.cos(angle) * base_offset
|
||||
by = CENTER + math.sin(angle) * base_offset
|
||||
|
||||
@@ -66,17 +68,17 @@ def _draw_starburst(img):
|
||||
right_y = by - math.sin(perp) * (petal_width / 2)
|
||||
|
||||
# Inner point (towards center, slight taper)
|
||||
inner_x = CENTER - math.cos(angle) * 2
|
||||
inner_y = CENTER - math.sin(angle) * 2
|
||||
inner_x = CENTER - math.cos(angle) * (SIZE * 0.02)
|
||||
inner_y = CENTER - math.sin(angle) * (SIZE * 0.02)
|
||||
|
||||
polygon = [(inner_x, inner_y), (left_x, left_y), (tip_x, tip_y), (right_x, right_y)]
|
||||
draw.polygon(polygon, fill=(255, 255, 255, 128))
|
||||
draw.polygon(polygon, fill=color)
|
||||
|
||||
# Center dot
|
||||
dot_r = 4
|
||||
dot_r = SIZE * 0.04
|
||||
draw.ellipse(
|
||||
[CENTER - dot_r, CENTER - dot_r, CENTER + dot_r, CENTER + dot_r],
|
||||
fill=(255, 255, 255, 128),
|
||||
fill=color,
|
||||
)
|
||||
|
||||
img = Image.alpha_composite(img, layer)
|
||||
@@ -94,10 +96,6 @@ def _draw_arc(img, pct):
|
||||
color = _hex_to_rgba(_arc_color(pct))
|
||||
pct = min(pct, 100)
|
||||
|
||||
# Pillow arc: 0 = 3 o'clock, angles go counter-clockwise for arc()
|
||||
# We want: start at 12 o'clock (-90), sweep clockwise
|
||||
# Pillow draws counter-clockwise from start to end, so we use:
|
||||
# start = -90, end = -90 + (pct/100)*360
|
||||
start_angle = -90
|
||||
end_angle = -90 + (pct / 100) * 360
|
||||
|
||||
@@ -110,7 +108,7 @@ def _draw_arc(img, pct):
|
||||
|
||||
|
||||
def render_icon(pct):
|
||||
"""Render a 128x128 RGBA icon with starburst + usage arc.
|
||||
"""Render a 256x256 RGBA icon with starburst + usage arc.
|
||||
|
||||
Args:
|
||||
pct: Usage percentage (0-100). Arc is invisible at 0.
|
||||
|
||||
Reference in New Issue
Block a user