Enter
Scaling in, opening. Content arriving into view.
The one stop quantum computing platform.
IndustryQuantum computing & AI
Scale20+ QPUs and simulators
SurfacesDark marketing site · light/dark app
Where you develop quantum and AI algorithms
qBraid is built for engineers shipping real quantum applications. Neutral, multi-hardware, multi-framework. The brand speaks with technical authority and stays out of the way of the work.
Two coordinated surfaces share one identity. The marketing site runs premium dark: near-black stage, warm off-white ink, paper alternate sections. The product app ships light and dark themes on the same violet.
Color is spent deliberately. One violet accent does the interactive work. The blue-to-purple gradient is for hero moments. The logo's own gradient belongs to the mark alone. Overuse dilutes it; restraint makes it pop.
Lockup on Void (SVG)
The mark carries the only gradient in the system: near-black purple through violet to magenta. It appears at most once per page. The rest of the interface stays quiet so it pops.
Light
Dark
Mark on Void
Color
Seven colors, no more: white or near-black stages, one violet brand hue that warms a step in dark mode, and the logo gradient spent on decorative moments, never on chrome.
The brand hue shifts by theme: #8B5CF6 in light mode, #A855F7 in dark. Never mix the two on one surface.
The Logo Gradient runs near-black purple through violet to magenta. It appears max once per page: the footer wordmark mask and decorative graphics. Never on heading text or buttons.
The app uses its own interactive gradient, blue to violet to purple: #3B82F6 to #8B5CF6 to #A855F7 in light mode, #60A5FA to #A855F7 to #C084FC in dark. Hero text and 3 to 8 percent card washes only.
Dark cards and auth screens sit on Aubergine #18141F, the one violet-tinted surface in the system.
State colors (success, warning, info) are app-level tokens, not brand colors. Text on any background meets WCAG 2.1 AA.
Typography
Two faces, one voice: Space Grotesk for headings and body, JetBrains Mono for everything technical. The same pair qbraid.com ships today.
Space Grotesk
Space Grotesk carries headings and body copy. Geometric, distinctive letterforms; headings stay at regular-to-medium weight with tight tracking.
ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@€£$&*})({§?
JetBrains Mono
JetBrains Mono is the technical voice: code, terminal output, nav labels, badges, and section numbers. Uppercase at small sizes with 0.08em letter spacing.
Built for engineers shipping real quantum applications.
RegularMedium
Display · 56pxBuilt for engineers shipping real quantum applications.
H1 · 40pxBuilt for engineers shipping real quantum applications.
H2 · 30pxBuilt for engineers shipping real quantum applications.
H3 · 22pxBuilt for engineers shipping real quantum applications.
Body · 16px
Built for engineers shipping real quantum applications.
Small / caption · 14px
Built for engineers shipping real quantum applications.
Mono label · 12px
Built for engineers shipping real quantum applications.
Body copy is Space Grotesk Regular, never mono. JetBrains Mono is reserved for code, terminal output, nav labels, badges, and section numbers.
Keep body text at 16px or bigger. 14px is only for captions and helper text.
This is the pair the marketing site already ships; the app runs Geist. One or the other should win eventually.
The logo is a PNG image, not a font. Never type it out.
Keep the logo gradient off headings and buttons. Gradient text is for hero moments, once per page at most.
Motion & Animation
One easing curve across the entire site, cubic-bezier(0.2, 0.7, 0.2, 1), at three speeds: 180ms hover, 320ms transitions, 600ms scroll reveals. Consistency over variety.
In motion
Move
Reordering, shuffling. The system responding to a gesture.
Glide
The view moves between fixed points. Near shapes sweep, far ones barely shift.
Push
The view travels forward. What was far behind ends up in front of you.
Pan
One long sideways move. The curve decides how it starts and how it stops.
In real use
Exchange
Carousel
Toggle
Tabs
The curve
Enter
Move
Timing: Fast 180ms for hover and color changes. Normal 320ms for most transitions and dropdowns. Slow 600ms for reveal-on-scroll and page-load orchestration. Nothing on a UI element exceeds 600ms. Reveal on scroll: opacity 0 to 1 plus a 14px rise over 600ms, triggered by IntersectionObserver. Feature rows enter with a 120ms stagger between text and graphic. Signature set pieces, one per page: Conway tiles drifting 70 to 120px over 30s, the OrbitalSpire Bloch sphere tilting with the pointer, the Dirac-notation text scramble, and the qubit-lattice hero pulse.
Forbidden: transition-all, bounce or elastic easing, more than one parallax element per page, scroll-jacking, glassmorphism as decoration, gradient text on metrics, drop shadows on cards. Every animation respects prefers-reduced-motion. Conway tiles freeze, OrbitalSpire never mounts its WebGL canvas, marquees stop, and reveals render in their final state immediately.
Voice
qBraid talks to engineers shipping real quantum applications. Technical authority, neutrality, zero hype.
Submit the same circuit to IonQ, IBM, or Rigetti without rewriting it.
Multi-hardware. Multi-framework. Your choice.
pip install qbraid, then run on real hardware.
Built for engineers shipping real quantum applications.
Headlines
Do
Where you develop quantum and AI algorithms.
Don't
The revolutionary future of quantum is HERE!
Claims
Do
Runs on IonQ, IBM Quantum, Rigetti, and more.
Don't
The best quantum hardware on earth.
Errors
Do
Your job failed: backend timeout after 300s. Retry or switch devices.
Don't
Oops! Something went wrong 😢
Imagery
Real product and real people. Screenshots ship as they are, education happens in actual classrooms, and the dot grid is the only texture.
No stock photography. No abstract quantum art. The product is the imagery.
In use
The system in place: dark stage, quiet chrome, the mark carrying the color.
Where you develop quantum algorithms
The one-stop quantum computing platform. Neutral. Multi-hardware. Multi-framework.
Start building
Edit profileqBraid@qbraid_official
The one-stop quantum computing platform. Neutral. Multi-hardware. Multi-framework.
412 Following12.8K Followers
Where you develop quantum algorithms
qBraidBrand deckJuly 202601
qBraid
qbraid.com
qBraid9:41
Mail
Photos
NotesqBraid
Maps
Calendar
App Store
FaceTime
Assets
Official qBraid marks and colors, ready to place. Use them as-is. No recoloring, no redrawn gradients.
Free to use in qBraid work. The gradient mark is the identity: never recolor it or rebuild its gradient in CSS. On dark surfaces use the SVG lockup or the white wordmark. Keep clear space of half the mark's height.
Logo files
Every mark variant in this guideline, straight from the brand tokens.
Typefaces
The faces this brand sets in — files or foundry links.
Space Grotesk
Get at Google FontsJetBrains Mono
Get at Google FontsBrand colors
The palette as working files, generated from the tokens.
Brand art
The violet dot grid: qBraid Violet dots on a Night or White field, 32px spacing. Both tile seamlessly, so run them at any size behind heroes, empty states, and section openers. Keep them at low contrast and let content sit on top.
