Solar/warm design system for Tchomb — the video platform for African creators.
"We are solar and gold and light."
npm install @tchomb/uiWarm, sun-drenched palette — never dark-mode-default:
| Token | Value | Usage |
|---|---|---|
paper |
#F6F2EA |
Page background |
ink |
#1A1714 |
Primary text |
sun |
#FF8C00 |
Primary accent |
gold |
#D4A017 |
Premium/richesse |
terracotta |
#D14A28 |
CTA/links |
Fonts: Syne Extra Bold (headings), Nunito (body), Clash Display (features).
| Component | Description |
|---|---|
Avatar |
Creator avatar with fallback initial |
PillTabs |
Horizontal scrollable tab pills |
SectionHeader |
Section title with optional action link |
VideoThumbnail |
Video card with gradient overlay and stats |
MusicPodcastCard |
Music/podcast card |
TrendingCard |
Trending hashtags list |
SuggestedCreatorsCard |
Creator suggestions with follow button |
Skeleton |
Animated skeleton loaders |
GoldDust |
Floating gold particles animation |
Confetti |
Celebration burst animation |
ErrorBoundary |
Error boundary with French UI |
LikeAnimation |
Heart burst with haptic feedback |
import { Avatar, VideoThumbnail, colors, fonts } from '@tchomb/ui';
<Avatar username="creator" size={40} />
<VideoThumbnail thumbnailUrl={url} title="Ma vidéo" size="md" />| Package | Description |
|---|---|
| @tchomb/shared-types | Shared TypeScript types |
| @tchomb/ui | Design system — components + tokens |
| @tchomb/api-client | Typed HTTP client |
| @tchomb/upload | Upload state machine |
| @tchomb/player | Vertical video player |
MIT