The widget library for Squarespace is here Learn more

Partial Circle Call to Action

Free

The Partial Circle Call-to-Action is a high-impact section designed to break the standard linear boundaries of web design. By utilizing a massive, arched geometric background, this widget creates a "window" effect that draws the user’s focus toward the center of your brand's message. It is a bold, modern choice for landing pages that need to communicate momentum and clarity with an architectural edge.

Design & Visual Aesthetic

The widget is built on the principle of geometric minimalism, using scale and shape to create a sense of professional authority.

  • Architectural Arch: The defining feature is the large semi-circle that frames the content. This shape acts as a visual spotlight, creating a distinct "stage" for your copy. Whether set in a vibrant lime green or a muted neutral tone, the arch adds a level of structural sophistication that feels bespoke.
  • Typographic Centerpiece: The layout features a bold, high-contrast headline designed to deliver a punchy value proposition. The balanced secondary text provides a softer "refining" message, ensuring the overall composition feels approachable yet highly professional.
  • The "Explore" Orbit: In the lower corner, a secondary circular button provides a tactical "Explore now" prompt. This design detail creates a visual "rhythm" between the large background arch and the smaller interactive element, making the entire section feel cohesive.

Core Features

  • Geometric Background Engine: The arch is fully customizable through the Redesignee interface. You can adjust the curvature, height, and color to perfectly match your site’s design system.
  • Interactive Floating Button: The circular CTA button can be positioned to "float" partially off the main shape, adding a layer of depth and encouraging user clicks with smooth hover interactions.
  • Fluid Engine Optimized: Built to work natively with the Squarespace Fluid Engine, this widget is lightweight and ensures your page remains fast and responsive while delivering a "big-budget" editorial look.
  • Adaptive Content Stacking: On mobile devices, the arch intelligently resizes to maintain its iconic silhouette while keeping the typography large and legible for a seamless user experience.

Where to Use This Widget

This component works best as a "punctuation mark" for your website’s journey:

  • Footer Call-to-Action: Place this at the very bottom of a long sales page or portfolio to "cap off" the content with a bold invitation to collaborate.
  • Service Introductions: Use the arch as a way to transition into a new set of offerings, giving the services a "fresh start" visual feel.
  • Announcement Banners: Perfect for "Now Open" or "New Launch" messaging where you want the announcement to feel significant and physically distinct from the rest of the page.
  • Portfolio "Hero" Ends: Use it at the end of a project case study to move the user’s "next idea forward" by leading them back to a contact or booking page.

How to use this widget

  • Change your content and adjust the styles to match your design
  • Click export and copy the code
  • Paste it on your web page by adding a code/html block in your website builder (e.g., Squarespace, WordPress, Webflow, Wix) and paste the code.

👋 P.S. Have questions? Leave a comment.