Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →rshankras/liquid-glass
Implement Liquid Glass design using .glassEffect() API for iOS/macOS 26+. Covers SwiftUI, AppKit, UIKit, and WidgetKit.
Passed 22 of 22 test cases with the skill, and 5 of 22 without it.
and 21 more in the full report
17 fixed5 passed either way0 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 17 test cases the skill fixed. Same model, same prompt, with and without the skill.
I have a UIKit navigation bar with several bar button items. One specific share action button needs to break away from the continuous navigation bar material and display independently. Which property on UIBarButtonItem opts out of the continuous bar glass background?
| Checked | Without skill | With skill |
|---|---|---|
| Sets hidesSharedBackground to true on the UIBarButtonItem. | Missed | Passed |
The instructions your model reads when the skill loads.
Implement Apple's Liquid Glass design language across all Apple UI frameworks. Covers SwiftUI (.glassEffect()), AppKit (NSGlassEffectView), UIKit (UIGlassEffect + UIVisualEffectView), and WidgetKit (rendering modes, accented content, glass elements in widgets).
UIVisualEffectViewUIGlassEffect or UIGlassContainerEffectLiquid Glass is the material of the navigation layer — bars, toolbars, floating controls — never the content layer (tables, lists, rows in a scroll view).
| Rule | Detail |
|---|---|
| Never glass on glass | Don't stack glass. Elements sitting ON glass don't get the material again — style them with fills and vibrancy. |
| Two variants — never mix them | Regular (default): works at any size, over anything, with adaptive legibility. Clear: only when ALL three hold — media-rich content underneath, a dimming layer is acceptable, and bold bright content sits above. Clear has no adaptive behaviors. One variant per interface. |
| Tint only primary actions | "When every element is tinted, nothing stands out." |
| No steady-state intersections | In resting layouts, content shouldn't sit half-under a glass element — reposition or scale the content instead. |
| Strip decorated bars | Remove customized bar backgrounds and borders; build hierarchy through layout and grouping, not decoration. Never group a symbol with a text label in one toolbar group. Action sheets spring from their source element. |
Scroll edge effects keep floating elements separated from scrolling content: soft (gradual fade — the iOS default) vs hard (denser, with a dividing line — mostly macOS). One per view edge, and they're not decorative — don't add one where no floating UI elements exist.
Shape system — let containers do the math:
| Shape | Radius | Use |
|---|---|---|
| Fixed | Constant | Standalone elements |
| Capsule | Half the element height | Phone-scale controls — add extra margin from the screen edge |
| Concentric | Parent radius minus padding | Nested containers (inner radii auto-calculate); iPad/Mac elements concentric with the window edge |
Accessibility comes free at the system level: Reduced Motion decreases lensing and elastic effects; Increased Contrast renders glass elements black/white with a contrasting border. (Lensing is how glass appears — it materializes by modulating how it bends light, and adaptive shadows flip small elements light/dark for legibility over any content.)
test cases passed, vs 5 / 22 without
Published skills whose descriptions closely match this one, with their headline benchmark lift.
More skills from the same source and nearby in the registry, with their headline benchmark lift.