\DESIGNSORCERY>_

No.1 Site-Builder for Confluence, Jira & JSM | Create Custom Sites – Refined

Video · Light

Design System Inspiration

Refined — extracted via DESIGN.md

No-code · Site builder

corporate clean typographic dark-theme geometric split-screen hero bento grid layout sticky navigation dark mode toggle

Typography

Regola Pro

Heading

Aa Aa Aa Aa

Color palette

TL;DR

Refined utilizes a sophisticated "monochrome" system that leans heavily into a primary palette of dark forest green (#043e36) and bright mint (#4fe09b). The interface is characterized by a "pill-and-panel" geometry, where buttons and decorative containers use extreme 360px or 50px radii to soften the professional Atlassian-ecosystem context. Typography is exclusively Regola Pro, ranging from massive 96px display sizes to functional 16px body text, maintaining a consistent geometric sans-serif voice. Layouts alternate between clean white surfaces and deep green "ink" sections, using subtle #dcdcdc borders to define structure without adding visual noise.

Target audience

The target audience is businesses and IT professionals looking for a no-code solution to build branded intranets, knowledge bases, and support portals within Confluence, Jira, and JSM.

Full tech stack

cdnjs Cloudflare dc.js Google Tag Manager Intellimize jQuery jsDelivr reCAPTCHA

Analytics

Google Tag Manager

Meta description

Refined transforms Confluence, Jira, and JSM into branded, user-friendly sites. Build custom intranets, knowledge bases, support portal, and more—no coding required.

Brand Voice

Professional, empowering, and clear, focusing on the transformation of complex tools into beautiful, user-friendly experiences.

Positioning

Refined provides site-building and UX apps for organizations using the Atlassian stack (Jira and Confluence). It is designed for businesses that need to turn technical environments into branded, accessible intranets and help desks.

Voice principles

  • Transformative: Uses active verbs to describe the shift from "complex" or "boring" to "beautiful" and "engaging."
  • Empowering: Focuses on what the user can achieve, build, and deliver rather than just listing technical features.
  • Clear: Uses simple, direct language to explain technical concepts like ITSM, macros, and navigation.
  • Collaborative: Emphasizes partnership, shared knowledge, and community through its global network and internal values.

More SaaS Designs

← Back to Gallery