Skip to content

v1.3.0 — The Canonical Iconless Button Standard (Studio-Verified)

Latest
Latest

Choose a tag to compare

View all tags
@TemporaryLooker22 TemporaryLooker22 released this 04 Oct 22:28
v1.3.0
52ac1ed

What's New in v1.3.0

🔘 The Canonical Iconless Button Standard (Studio-Verified)

This release introduces the definitive, mandatory blueprint for any button requested without an icon in Roblox Studio (such as Throw, Action, Jump, Redeem, Confirm, OK, etc.), directly verified and extracted from the live Studio benchmark.

📐 Exact Layer Hierarchy & Architecture

  1. Sharp 90° Comic Rectangular Geometry: No UICorner (or 0 radius). Punchy straight-edged silhouette.
  2. Thick Solid Outer Border: 3px solid #0C141A (RGB 12, 20, 26) border stroke with ApplyStrokeMode.Border.
  3. 90° Linear Color Gradient: Saturated top highlight transitioning smoothly to a deeper bottom shade (e.g. Yellow-to-Orange #FFE808 to #FF6800, Lime Green, Electric Cyan, Hot Pink, Royal Purple).
  4. Subtle Black Checkerboard Overlay: ImageLabel with ImageColor3 = #000000, TileSize 19 x 19 px, and a vertical UIGradient transparency fade from 0.91 (top) to 0.62 (bottom).
  5. Triple-Layered Specular Glass Highlight: Three nested frames creating a soft, anti-aliased Fresnel reflection glow along the perimeter:
    • InnerHighlight1 (Inset 2px): 1px white stroke at 25% transparency (75% opacity).
    • InnerHighlight2 (Inset 4px): 1px white stroke at 45% transparency (55% opacity).
    • InnerHighlight3 (Inset 6px): 1px white stroke at 80% transparency (20% opacity).
  6. GothamBlack Typography with Optical Lift: White #FFFFFF centered text with 3px solid #11171A contextual outline, shifted 1px upward (Position = UDim2.new(0.5, 0, 0.5, -1)) for perfect optical vertical weight balance.
  7. Center-Anchored Tween Engine: AnchorPoint = Vector2.new(0.5, 0.5) with child UIScale (ButtonScale) driven by 4 tactile micro-interaction tweens:
    • Hover In: Scale to 1.06 in 0.08s (Quad.Out) + Hover Sound
    • Hover Out: Scale to 1.00 in 0.08s (Quad.Out)
    • Mouse Down: Scale to 0.94 in 0.05s (Quad.Out) + Click Sound
    • Mouse Up: Scale to 1.06 in 0.12s (Back.Out)

📜 The Non-Negotiable Rule (Tenet 11)

Whenever an agent or developer is asked to create a button without an icon, they MUST ALWAYS follow this exact design and layer hierarchy.

📦 Code & Examples Added

  • CheckUIComponents.createStandardButton: Production constructor function implementing the complete blueprint.
  • CheckUITheme.ButtonGradients: Palette presets (YellowOrange, LimeGreen, ElectricCyan, HotPink, RoyalPurple, CrimsonRed, MetallicSilver).
  • examples/StandardButtonExample.luau: Standalone showcase script with device-responsive scaling and sound bindings.
  • assets/standard_button_studio.png: Direct screenshot from edit-time Studio session.
Assets 2
Loading