mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 09:25:06 +03:00
## What kind of change does this PR introduce?
Chore: rename customer logo folders and document the theme contract. No
intended visual change, aside from Phoenix Energy whose two marks were
in the wrong folders.
## What is the current behavior?
Customer logos live at:
- `/images/customers/logos/{slug}.png` (`logo`, light mode)
- `/images/customers/logos/light/{slug}.png` (`logo_inverse`, dark mode)
`light/` actually means “use me on a dark background”.
## What is the new behavior?
Same assets, clearer paths:
- `/images/customers/logos/on-light/{slug}.png` → dark/black mark →
`logo` → light mode
- `/images/customers/logos/on-dark/{slug}.png` → light/white mark →
`logo_inverse` → dark mode
Icon chips stay at `/images/customers/logos/{slug}-icon.svg`. Old
`/images/customers/logos/light/*` URLs redirect to `on-dark`. www README
now has the contract.
# To test
Use the [www
preview](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app).
Toggle light/dark from the site header on each page. Logos should stay
readable (no white-on-white or black-on-black).
1. [Customers
grid](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/customers)
— main `logo` / `logo_inverse` surface. Spot-check Juniver, Phoenix
Energy, and one other card.
2. [Phoenix Energy
story](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/customers/phoenix-energy)
— story header uses `logo` only (on-light, plus a dark-mode brightness
filter). We swapped this pair.
3.
[Homepage](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/)
— “How industry leaders…” section. Icon chips only (`*-icon.svg`); the
wordmark `logo` field is unused here.
4. [Solutions /
Agents](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/solutions/agents)
— Chatbase quote near the top shows both theme variants. Same pattern on
[/healthcare](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/solutions/healthcare),
[/finserv](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/solutions/finserv),
and
[/b2b-saas](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/solutions/b2b-saas).
5. [Contact
sales](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/contact/sales)
— Good Tape / Xendit / Chatbase wordmarks (`on-light`). Same logos on
the demo form at
[/solutions/enterprise](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/solutions/enterprise).
6.
[Enterprise](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/solutions/enterprise)
— Mozilla / Epsilon3 / Pebblely icons in the use-cases section
(`on-dark`).
7.
[Vector](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/modules/vector)
— customer quotes. This is the only page that builds `on-light` /
`on-dark` paths at runtime from the customer slug.
8. [Mobbin
event](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/events/migrating-from-firebase-mobbin)
— company logo uses event `logo` / `logo_light` (dark vs light).
Optional second:
[/events/scale-to-millions-goodtape-auth](https://zone-www-dot-com-git-dnywh-chorecustomer-logo-o-0d7bc1-supabase.vercel.app/events/scale-to-millions-goodtape-auth).
Quick extra: hover **Product** in the site nav. The customer story
thumbnail uses `imgUrl` (`on-light`).
<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit
## Documentation
- Clarified customer logo requirements, including separate light and
dark asset locations, monochrome formats, and dark PNG assets for image
generation.
## Updates
- Standardized customer logos across stories, events, sales pages,
solution pages, testimonials, and generated images.
- Improved logo rendering across light and dark themes with dedicated
variants.
- Added permanent redirects for legacy logo URLs while preserving
filename suffixes.
## Tests
- Added coverage verifying legacy logo redirects resolve correctly,
including supported exceptions.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->
310 lines
11 KiB
TypeScript
310 lines
11 KiB
TypeScript
import {
|
|
Check,
|
|
ClipboardCheck,
|
|
FolderLock,
|
|
HeartPulse,
|
|
Lightbulb,
|
|
List,
|
|
Lock,
|
|
ShieldAlert,
|
|
ShieldCheck,
|
|
Users,
|
|
UserX,
|
|
} from 'lucide-react'
|
|
import { PRODUCT_SHORTNAMES } from 'shared-data/products'
|
|
import { Image } from 'ui-patterns/Image'
|
|
|
|
import MainProducts from '../MainProducts'
|
|
import { getSharedSections } from './shared-sections'
|
|
import {
|
|
FrameworkLink,
|
|
type FeaturesSection,
|
|
type HeroSection,
|
|
type Metadata,
|
|
} from './solutions.utils'
|
|
import type { SecuritySectionProps } from '@/components/Enterprise/Security'
|
|
import { frameworks } from '@/components/Hero/HeroFrameworks'
|
|
import type { FeatureGridProps } from '@/components/Solutions/FeatureGrid'
|
|
import type { PlatformSectionProps } from '@/components/Solutions/PlatformSection'
|
|
import type { ResultsSectionProps } from '@/components/Solutions/ResultsSection'
|
|
import { TwoColumnsSectionProps } from '@/components/Solutions/TwoColumnsSection'
|
|
import { useSendTelemetryEvent } from '@/lib/telemetry'
|
|
|
|
const data: () => {
|
|
metadata: Metadata
|
|
heroSection: HeroSection
|
|
singleQuote: {
|
|
id: string
|
|
quote: {
|
|
text: string
|
|
author: string
|
|
role: string
|
|
link?: string
|
|
logo?: React.ReactElement
|
|
}
|
|
}
|
|
why: FeaturesSection
|
|
platform: PlatformSectionProps
|
|
developerExperience: ReturnType<typeof getSharedSections>['developerExperience']
|
|
resultsSection: ResultsSectionProps
|
|
featureGrid: FeatureGridProps
|
|
securitySection: SecuritySectionProps
|
|
platformStarterSection: TwoColumnsSectionProps
|
|
customerEvidence: {
|
|
id: string
|
|
heading: React.ReactNode
|
|
customers: Array<{
|
|
name: string
|
|
logo?: string
|
|
highlights: string[]
|
|
cta?: { label: string; href: string }
|
|
}>
|
|
}
|
|
} = () => {
|
|
const shared = getSharedSections()
|
|
const sendTelemetryEvent = useSendTelemetryEvent()
|
|
|
|
return {
|
|
metadata: {
|
|
metaTitle: 'Supabase for Financial Services',
|
|
metaDescription:
|
|
'Secure, compliant financial applications without the complexity. SOC 2, ACID transactions, real-time data, and audit trails built in.',
|
|
},
|
|
heroSection: {
|
|
id: 'hero',
|
|
title: 'Supabase for Financial Services',
|
|
h1: (
|
|
<>
|
|
<span className="block text-foreground">Secure, compliant financial applications</span>
|
|
<span className="block md:ml-0">without the complexity.</span>
|
|
</>
|
|
),
|
|
subheader: [
|
|
<>
|
|
Supabase is a Postgres development platform with SOC 2 certification, ACID transactions,
|
|
real-time data, and audit trails built in. Build for trading, payments, lending, and
|
|
embedded finance from one platform.
|
|
</>,
|
|
],
|
|
image: undefined,
|
|
ctas: [
|
|
{
|
|
label: 'Start your project',
|
|
href: 'https://supabase.com/dashboard',
|
|
type: 'primary' as any,
|
|
onClick: () =>
|
|
sendTelemetryEvent({
|
|
action: 'start_project_button_clicked',
|
|
properties: { buttonLocation: 'Solutions: FinServ page hero' },
|
|
}),
|
|
},
|
|
{
|
|
label: 'Request a demo',
|
|
href: 'https://supabase.com/contact/sales',
|
|
type: 'default' as any,
|
|
onClick: () =>
|
|
sendTelemetryEvent({
|
|
action: 'request_demo_button_clicked',
|
|
properties: { buttonLocation: 'Solutions: FinServ page hero' },
|
|
}),
|
|
},
|
|
],
|
|
},
|
|
singleQuote: {
|
|
id: 'social-proof',
|
|
quote: {
|
|
text: 'We wanted a backend that could accelerate our development while maintaining security and scalability. Supabase stood out due to its automation, integrations, and ecosystem.',
|
|
author: 'Raunak Kathuria',
|
|
role: 'VP of Engineering, Deriv',
|
|
link: '/customers/deriv',
|
|
logo: (
|
|
<>
|
|
<Image
|
|
src="/images/customers/logos/on-light/deriv.png"
|
|
alt="Deriv"
|
|
width={128}
|
|
height={48}
|
|
className="object-contain w-24 md:w-32 dark:hidden"
|
|
/>
|
|
<Image
|
|
src="/images/customers/logos/on-dark/deriv.png"
|
|
alt="Deriv"
|
|
width={128}
|
|
height={48}
|
|
className="object-contain w-24 md:w-32 hidden dark:block"
|
|
/>
|
|
</>
|
|
),
|
|
},
|
|
},
|
|
why: {
|
|
id: 'why-supabase',
|
|
label: '',
|
|
heading: (
|
|
<>
|
|
Why <span className="text-foreground">financial services companies</span> choose Supabase
|
|
</>
|
|
),
|
|
subheading: 'Build secure, scalable financial applications using a trusted data platform.',
|
|
features: [
|
|
{
|
|
id: 'compliance',
|
|
icon: ShieldCheck,
|
|
heading: 'Compliance you can prove, not just claim.',
|
|
subheading:
|
|
'SOC 2 Type II certified with comprehensive audit logs, encryption at rest and in transit, and database-level access controls. Meet regulatory requirements with infrastructure that documents every action automatically.',
|
|
},
|
|
{
|
|
id: 'transactional-integrity',
|
|
icon: Check,
|
|
heading: 'Transactional integrity at every layer.',
|
|
subheading:
|
|
'Postgres provides full ACID compliance for settlements, reversals, and multi-step financial operations. No partial writes, no eventual consistency surprises. Your ledger stays correct.',
|
|
},
|
|
{
|
|
id: 'realtime-data',
|
|
icon: MainProducts[PRODUCT_SHORTNAMES.REALTIME].icon,
|
|
heading: 'Real-time data for real-time decisions.',
|
|
subheading:
|
|
'Process transactions, detect fraud signals, and push updates to dashboards as they happen. Realtime subscriptions and Edge Functions give your applications the speed financial workloads demand.',
|
|
},
|
|
],
|
|
},
|
|
platform: {
|
|
...shared.platform,
|
|
title: (
|
|
<>
|
|
Supabase is the <span className="text-foreground">SOC 2-compliant Postgres platform</span>{' '}
|
|
you control
|
|
</>
|
|
),
|
|
subheading:
|
|
'Supabase includes everything you need to build secure, compliant financial applications.',
|
|
},
|
|
developerExperience: shared.developerExperience,
|
|
resultsSection: shared.resultsSection,
|
|
featureGrid: shared.featureGrid,
|
|
securitySection: {
|
|
id: 'security',
|
|
label: 'Security',
|
|
heading: (
|
|
<>
|
|
Trusted for{' '}
|
|
<span className="text-foreground">financial solutions and transactions of all types</span>
|
|
</>
|
|
),
|
|
subheading:
|
|
"Keep your data secure with SOC 2, HIPAA, and GDPR compliance. Your customers' data is encrypted at rest and in transit, with built-in tools for monitoring and managing security threats.",
|
|
features: [
|
|
{ icon: ShieldCheck, heading: 'SOC 2 Type II certified' },
|
|
{ icon: HeartPulse, heading: 'HIPAA compliant' },
|
|
{ icon: ShieldAlert, heading: 'DDoS Protection' },
|
|
{ icon: Lock, heading: 'Multi-factor Authentication' },
|
|
{ icon: ClipboardCheck, heading: 'Vulnerability Management' },
|
|
{ icon: Users, heading: 'Role-based access control' },
|
|
{ icon: List, heading: 'Database Audit Logs' },
|
|
{ icon: Lightbulb, heading: 'Security Advisors' },
|
|
{ icon: FolderLock, heading: 'Encrypted Storage' },
|
|
{ icon: UserX, heading: 'Network restrictions' },
|
|
],
|
|
cta: {
|
|
label: 'Learn about security',
|
|
url: '/security',
|
|
},
|
|
},
|
|
platformStarterSection: {
|
|
id: 'quickstarts',
|
|
heading: (
|
|
<>
|
|
<span className="text-foreground">Choose your platform</span> to start building in seconds
|
|
</>
|
|
),
|
|
headingRight: (
|
|
<>
|
|
Or, start with <span className="text-foreground">Supabase AI Prompts</span>
|
|
</>
|
|
),
|
|
docsUrl: 'https://supabase.com/docs/guides/getting-started/ai-prompts',
|
|
leftFooter: (
|
|
<div className="grid grid-cols-5 divide-x divide-y rounded-lg overflow-hidden border">
|
|
{frameworks.map((framework) => (
|
|
<FrameworkLink key={framework.name} framework={framework} />
|
|
))}
|
|
</div>
|
|
),
|
|
aiPrompts: [
|
|
{
|
|
id: 'auth-setup',
|
|
title: 'Bootstrap Next.js app with Supabase Auth',
|
|
code: 'Set up Supabase Auth with Next.js: install @supabase/supabase-js and @supabase/ssr, configure environment variables, create browser and server clients, and add middleware for token refresh.',
|
|
language: 'markdown',
|
|
docsUrl:
|
|
'https://supabase.com/docs/guides/getting-started/ai-prompts/nextjs-supabase-auth',
|
|
},
|
|
{
|
|
id: 'rls-policies',
|
|
title: 'Create RLS policies',
|
|
code: 'Generate Row Level Security policies for secure access control. Retrieve your schema, then write policies that restrict access to sensitive data based on user roles and auth.uid().',
|
|
language: 'markdown',
|
|
docsUrl:
|
|
'https://supabase.com/docs/guides/getting-started/ai-prompts/database-rls-policies',
|
|
},
|
|
],
|
|
},
|
|
customerEvidence: {
|
|
id: 'case-studies',
|
|
heading: (
|
|
<>
|
|
Customer <span className="text-foreground">stories</span>
|
|
</>
|
|
),
|
|
customers: [
|
|
{
|
|
name: 'Deriv',
|
|
logo: '/images/customers/logos/on-light/deriv.png',
|
|
highlights: [
|
|
'Accelerating online trading with scalable Postgres',
|
|
'Automation, integrations, and ecosystem',
|
|
],
|
|
cta: { label: 'Read the case study', href: '/customers/deriv' },
|
|
},
|
|
{
|
|
name: 'Bree',
|
|
logo: '/images/customers/logos/on-light/bree.png',
|
|
highlights: [
|
|
'10X performance gains when switching from Fauna',
|
|
'Greater developer velocity and AI-ready foundation',
|
|
],
|
|
cta: { label: 'Read the case study', href: '/customers/bree' },
|
|
},
|
|
{
|
|
name: 'Next Door Lending',
|
|
logo: '/images/customers/logos/on-light/next-door-lending.png',
|
|
highlights: [
|
|
'Top 10 mortgage broker with Supabase',
|
|
'Leveraged Postgres for lending workflows',
|
|
],
|
|
cta: { label: 'Read the case study', href: '/customers/next-door-lending' },
|
|
},
|
|
{
|
|
name: 'Rally',
|
|
logo: '/images/customers/logos/on-light/rally.png',
|
|
highlights: ['Building financial applications on Supabase'],
|
|
cta: { label: 'Read the case study', href: '/customers/rally' },
|
|
},
|
|
{
|
|
name: 'Xendit',
|
|
logo: '/images/customers/logos/on-light/xendit.png',
|
|
highlights: [
|
|
'Full solution shipped to production in less than one week',
|
|
'Payment processor with transaction verification',
|
|
],
|
|
cta: { label: 'Read the case study', href: '/customers/xendit' },
|
|
},
|
|
],
|
|
},
|
|
}
|
|
}
|
|
|
|
export default data
|