.png){kind=logo}
V1.10.0
- Added individual career role pages, Testimonials, Awards and Clients pages.
- Added a component style guide.
- Moved the showcase to the root route and expanded the navigation index.
Roqi
Premium React Template
A cinematic multipurpose React template for creative studios, digital agencies, architecture studios and AI brands.
Overview
A distinct starting point. Room to make it yours.
Roqi brings four creative directions into one React template: Creative Agency, Digital Studio, Architecture Studio and AI Studio. Each pairs its own visual identity with a shared system of pages, content and components.
Start with a complete design, then shape the typography, layouts and content around your studio or brand. Editorial composition and considered motion carry through from the homepage to the details of your work.
A closer
look.
Explore the other creative directions.
Select any preview to see it in full.
Features
Four creative directions
Creative Agency, Digital Studio, Architecture Studio and AI Studio. Choose a starting point, with shared pages and content underneath.
Pages beyond the homepage
Project archives and case studies, services, journal articles, team profiles, careers, testimonials, awards and contact pages.
A reusable design system
Section components, page layouts and Sass tokens make it possible to change the composition and visual language together.
Motion with consideration
GSAP animation and Lenis scrolling, with reduced-motion handling and responsive layouts across the template.
Content on your terms
Edit the bundled JavaScript data directly, or use the optional Payload CMS. The site falls back to bundled content when the CMS is unavailable.
Tech stack
- React 18
- Components and hooks
- Vite
- Development and production builds
- React Router 7
- Client-side page routing
- Bootstrap 5 + Sass
- Grid, utilities and design tokens
- GSAP
- Animation and transitions
- Lenis
- Smooth scrolling
- Payload CMS 3
- Optional content administration
Technical details
- Framework
- React 18 · Vite single-page application
- Language
- JavaScript / JSX
- Styling
- Bootstrap 5 grid + custom Sass
- CMS
- Optional Payload CMS 3 · SQLite
- Responsive
- Responsive layouts and WebP image variants
- Deployment
- Static frontend build; CMS hosted separately when enabled
- Version
- 1.10.0
- Version release
- August 1, 2026
Compatibility
- Browser build target
Production Browserslist target: >0.2%, not dead, not op_mini all
- Environment
Windows 10/11, macOS and Linux
Standalone React frontend, with optional Payload CMS
Requirements
- Node.js
- ^22.23.2 or ^24.20.0, as declared by the template. The documented setup uses Node 22.23.2.
- npm
- >=11.11.0 and <12. The package pins npm 11.11.0 and includes npm lockfiles.
- Optional CMS
- Payload uses SQLite. Run the included setup script to install and seed it; the standalone frontend needs no database.
- Form delivery
- Connect contact and newsletter submissions to your own endpoint or form service before publishing.
What’s included
- Template source
- React components, page layouts, Sass styles, bundled content and public assets.
- CMS source & setup
- Optional Payload application, starter content and setup scripts.
- Buyer documentation
- Standalone HTML guide, CMS setup guide and asset credits.
- Development tools
- Build configuration, npm lockfiles, example environment files and template tests.
- Version history
- The template’s CHANGELOG.md records released changes.
About the demo assets
The package’s asset inventory lists bundled photography, original artwork, screenshots, fonts and icons; it identifies no preview-only images. Third-party assets retain their own licenses. Review docs/credits-and-licenses.md and the original source terms for your use, and replace fictional brands and stock team portraits with your own content.
Documentation
A guide from setup to launch.
The included documentation/index.html covers installation, working with the demos and sections, customization, CMS setup, assets and deployment. Open it locally from the package.
Product support
A direct line
to the studio.
For help with Roqi, contact AVIR with your product version, a description of the issue and the steps to reproduce it.
Contact supportChangelog
Good to know
Is Roqi a Next.js template?
Roqi’s website is a React and Vite single-page application, written in JavaScript / JSX. Next.js hosts the optional Payload CMS admin application; it does not render the template frontend.
Do I need to set up the CMS?
No. Run npm install and npm run dev to work with the bundled content. The optional Payload CMS adds a content admin panel and uses the included SQLite setup.
How do I customize the design?
Choose a starter design, edit the content in src/data, and adjust the Sass design tokens and components. The included buyer guide covers page layouts, sections and CMS customization.
Are the preview images included?
The package’s asset inventory lists the demo imagery as included, with no preview-only assets. Photography, fonts and libraries retain their own licenses; the source credits and license notes are included in docs/credits-and-licenses.md.
Do the forms send messages immediately?
The template forms need your own submission endpoint or form service. Connect the contact and newsletter handlers before publishing; the included documentation explains the integration points.
Where can I get help?
Use AVIR’s Contact page for product questions or help with Roqi. Include the product version and enough detail to reproduce the issue.
Roqi is
almost ready.
Be notified when purchasing opens.