OOratiq

Team Section

Ready

People grid with avatars.

AH

Ahosan Habib

Founder

LH

Layla Haddad

Design

TR

Tomás Rivera

Engineering

AC

Amina Chowdhury

Developer relations

Installation

$ npx @oratiq-js/ui add team-section

Copies the component and everything it depends on into your project, then lists the npm packages to install. The code is yours after this.

Usage

import
import { TeamSection } from "@/components/blocks/team-section";

Style 02

AH

Ahosan Habib

Founder

Building the RTL-first web from Dhaka.

Product
LH

Layla Haddad

Design lead

Systems thinker; four launches in Arabic.

Design
TR

Tomás Rivera

Engineering

Radix contributor; keyboard-nav zealot.

Core
$ npx @oratiq-js/ui add team-section-02

Style 03

  • AHAhosan HabibFounder
  • LHLayla HaddadDesign lead
  • TRTomás RiveraEngineering
  • ACAmina ChowdhuryDevRel
  • NPNoa PeretzFrontend
  • JWJonas WeberPlatform
$ npx @oratiq-js/ui add team-section-03

Style 04

Ahosan Habib

Founder

Layla Haddad

Design lead

Tomás Rivera

Engineering

Noa Peretz

Frontend

$ npx @oratiq-js/ui add team-section-04

Style 05

AH

Ahosan Habib

Founder & product

Started Oratiq after shipping four bidirectional products the hard way. Believes reading order is a user right, not a feature flag.

LH

Layla Haddad

Founding designer

Type systems across Latin, Arabic, and Hebrew. Draws every glyph decision back to one question: does it read?

$ npx @oratiq-js/ui add team-section-05

Style 06

TR

Tomás Rivera

Engineering

AC

Amina Chowdhury

DevRel

JW

Jonas Weber

Platform

$ npx @oratiq-js/ui add team-section-06

What a block is

  • A full section, composed from the components in the sidebar — copy it in, replace the demo content, ship.
  • Every style is its own registry item: the command under each preview installs exactly that file.
  • Blocks read the same semantic tokens as everything else — your brand override applies instantly.
  • Logical properties throughout: flip dir on <html> and any style mirrors.

Content is yours

The text, links, and data inside are demo content by design. Blocks are starting points, not configurable widgets — edit the file directly.

View source on GitHub → components/blocks/team-section.tsx