Bjango

Shadows vary across platforms (CSS, Android, iOS) despite using same values. CSS shadows match well between Safari, Firefox, and Chrome, and also with Sketch and Figma. The key difference is in blur radius handling; scaling adjustments are necessary for consistency. CSS to iOS needs a 0.5× scale, while Android requires more complex adjustments based on rendering differences. The article provides formulas for converting shadow blur radii between platforms to achieve a good match.

https://bjango.com/articles/matchingdropshadows/

Bjango turns 20 this month, starting as friends creating free OS X widgets before launching full Mac apps like iStat Menus in 2007. Despite growth, their passion for software remains strong, remaining self-funded and focused on privacy. Grateful for support throughout the journey.

https://bjango.com/articles/twodecades/

Shoe sizes vary globally; for proper fit, specify size and region (e.g., “size 10 US”). Similarly, colors require both value and color space for accuracy (e.g., “#ff0000 in sRGB” vs. “#ff0000 in Display P3”). Display P3 allows wider color gamuts than sRGB and enhances vibrancy. Future design systems will mandate color spaces. Transitioning from hex to color() function accommodates color spaces directly. OKLCH offers advantages for blending but risks out-of-gamut colors. Color creation and deployment should be separated for optimal results. Tools like Pinwheel aid in managing these color complexities.

https://bjango.com/articles/designsystemcolourspace/