63:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/3gx96u50v9idb.js","/creators-assets/_next/static/immutable/chunks/125_ce2ese0y_.js","/creators-assets/_next/static/immutable/chunks/2ii8lkleumgkk.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/069_m7850i8jf.js","/creators-assets/_next/static/immutable/chunks/03586ab1rea-b.js","/creators-assets/_next/static/immutable/chunks/19qq0hy3mz_vv.js","/creators-assets/_next/static/immutable/chunks/2oixy7hansmjm.js","/creators-assets/_next/static/immutable/chunks/2rczsbgoa3afm.js","/creators-assets/_next/static/immutable/chunks/2a63j-5qkrdf4.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0-lv0573a1cyl.js","/creators-assets/_next/static/immutable/chunks/3kkqflhmmpg9p.js","/creators-assets/_next/static/immutable/chunks/0ib-rcz4b0eq3.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/24gcuxpvxd8dy.js","/creators-assets/_next/static/immutable/chunks/0xd4yj8g3g-ci.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3vd9_7_mqx0kl.js","/creators-assets/_next/static/immutable/chunks/3l37d07td4kzk.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3nw4q_evu8ge1.js","/creators-assets/_next/static/immutable/chunks/3o5qsyzxffd89.js","/creators-assets/_next/static/immutable/chunks/0sdd6rzuigoor.js","/creators-assets/_next/static/immutable/chunks/04onqby6uwgz7.js","/creators-assets/_next/static/immutable/chunks/16d5vpfsnfybw.js","/creators-assets/_next/static/immutable/chunks/3f4d4x4z1mrzh.js","/creators-assets/_next/static/immutable/chunks/0yulab_mho2q7.js","/creators-assets/_next/static/immutable/chunks/3_6nvj55e699g.js","/creators-assets/_next/static/immutable/chunks/2r15b2hek61lg.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/0pc9t50m5x90i.js","/creators-assets/_next/static/immutable/chunks/3fyhezch4qqad.js","/creators-assets/_next/static/immutable/chunks/3eh5q_6ksmw0l.js","/creators-assets/_next/static/immutable/chunks/2rdaqkxiyeq_6.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/0v2aom8xv86j9.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/0s-n7u5-dwtml.js"],"S"] 64:T87b,

Testimonial Bento arranges customer quotes into an asymmetric bento grid and reveals them one card at a time as visitors scroll. Three card styles and per-card placement let you compose a wall that looks arranged, not generated.

Key Features

Three card styles: Light with a blueprint grid, Dark, and Accent Sequential scroll reveal in reading order, with editable stagger, duration, offset, blur, trigger point, and once-or-always replay
Three layouts from one component: 3-column bento, horizontal row groups, single stack Per-card column and size weight, so your composition survives every breakpoint
Container-based responsiveness, with both breakpoints editable
Three-level avatar fallback: upload, URL, built-in artwork, then an initials placeholder Retina avatars at 128/192/256px, roughly 8KB each instead of 90KB Optional baseline rule with editable width, thickness, offset, color, and end caps 49 controls plus 8 per testimonial, including 5 fonts and 14 colors
Respects reduced motion, and shows the finished layout on the canvas 7 pre-loaded testimonials, works on Framer Canvas and published sites

Where to Use

Landing page social proof, SaaS trust sections, agency client walls, case-study roundups, course and community testimonials.

Best For

Teams with a handful of strong quotes rather than dozens, designers who want an editorial arrangement instead of an even grid, and Framer users who need full visual control without code.

Why This Component

Unlike a uniform testimonial grid or an auto-scrolling marquee, Testimonial Bento treats placement as a design decision. You choose which column each quote sits in and how much room it claims, and that composition survives every breakpoint: on tablet the columns lie down as rows instead of being reshuffled into arbitrary halves. The reveal follows reading order, so the wall assembles itself in front of the visitor.

Built for Framer. Drop it onto your canvas, customize it, and publish.

65:T8d7,

Pricing Plans Pro is a polished, interactive pricing picker for SaaS and tiered products. It combines an animated billing toggle, expandable feature drawer, and live user-based pricing in one connected interface. Visitors can compare plans without leaving the page, while the component adapts seamlessly from mobile to desktop.

Key Features

Vertical or Horizontal layout with automatic frame resizing
Animated Monthly/Yearly toggle with customizable discount badge
Up to 8 plans with names, descriptions, monthly/yearly prices, and features
Live price calculation based on user/seat count with smooth animations
Configurable user counter with +/- controls, starting value, and label
12 currencies via native Intl.NumberFormat: USD, EUR, GBP, JPY, CAD, AUD, CHF, CNY, INR, BRL, MXN, SGD
Feature separators using newlines or |
Optional custom user and feature icons
Animated feature drawer with sequential slide-up effects
Responsive CTA with hover and tap animations
9 editable font controls and extensive color customization
Container-based responsiveness using ResizeObserver, with compact mode below 380px
3 pre-loaded plans: Plus, Standard, Advanced
Works on both Framer Canvas and published sites

Where to Use

Ideal for SaaS pricing, per-seat subscriptions, storage and infrastructure tiers, bootcamps, memberships, communities, APIs, and developer tools.

Best For

Teams selling tiered products with per-user pricing, designers needing one responsive component, and Framer users who want complete visual control without coding.

Why This Component

Unlike static three-column pricing grids or stepper modals, Pricing Plans Pro keeps everything connected. The active plan reveals its features, pricing updates instantly as seats change, and the same component switches between mobile-stacked and desktop-horizontal layouts through a single property.

Built for Framer. Drop it onto your canvas, customize it, and publish.

66:Tf08,

Country Accordion is a polished section component that turns "we operate in 24 countries" into an interactive list of real flags grouped by region. Instead of a wall of text or a static grid, countries are organized into expandable region rows — show the first four inline, then let visitors click Show all to reveal the rest with a smooth height animation.

Each region row features a typographic label (uppercase, tracked), a responsive flag grid, and a transparent toggle that rotates a + icon to × when expanded. Country pills use real flag icons loaded automatically from flagcdn.com — no manual uploads, no broken image links. A configurable mobile breakpoint stacks the layout vertically on narrow widths, with the grid reducing to two columns for readability.

Designed for fintech, ecommerce, SaaS, and travel brands that need to communicate geographic reach without burying it in a footer or hiding it behind a "see all countries" link.

Key Features

Flat country list — one entry per country, grouped at render by region label
Real flag icons via flagcdn.com (2-letter ISO codes, no manual hosting)
Smooth expand/collapse animation per region (Framer Motion height + opacity)
Configurable visible-items count before "Show all" appears
1–6 grid columns on desktop, auto-reduces to 2 columns on mobile
Container-based responsive — uses ResizeObserver, adapts to canvas width not viewport
Editable fonts for subtitle, title, region labels, country names, description, and CTA via Framer Font controls
Per-element visibility toggles (subtitle, title, description, CTA) with auto-hiding sub-options
7 separate color controls — card, border, pill, muted text, foreground, CTA background, CTA text
Adjustable border radii for card, pills, and CTA
CTA button with hover arrow slide-swap and tap scale animation
Up to 200 countries via Array property control
24 countries pre-loaded across 3 regions (Europe, Africa, Americas)
Works on canvas and published site

Where to Use

Fintech and remittance landing pages listing supported countries
Ecommerce stores showing shipping destinations
SaaS marketing pages communicating global reach
Travel platforms displaying their booking network
Crypto exchanges showing supported jurisdictions
Hiring pages listing countries where the company employs
About pages with a "Markets we serve" section

Best For

Teams that need to display 15+ countries without overwhelming the layout
Brands that want supported regions to feel structured, not like an afterthought
Designers who want full typographic and color control from the Properties panel
Framer users who need a drop-in coverage section with zero data wiring

Why This Component

A bullet list of countries is forgettable. A world map is heavy and rarely accurate. Country Accordion sits between the two — structured enough to scan, light enough to drop into a page that's already busy. Regions stay collapsed by default so the section never dominates the layout, and the Show all toggle reveals depth on demand. Real flags ground the list visually, and the property controls let you match your brand without touching code.

Built for Framer. Drop it on your canvas and publish.

67:Tc41,

Scrolling Testimonials Pro is a polished, multi-column testimonial component that brings your customer reviews to life with smooth, infinite vertical scrolling. Instead of static grids or manual carousels, testimonials flow continuously in parallel columns at different speeds, creating a dynamic, living wall of social proof that catches attention without demanding interaction.

Each testimonial card features customer text, avatar, name, and role with crisp typography, soft shadows, and rounded corners. The component handles layout automatically—distributing testimonials evenly across 1, 2, or 3 columns using round-robin logic. A gradient fade mask at the top and bottom creates a seamless, elegant transition that makes the scroll feel endless.

Designed for SaaS brands, agencies, startups, and any team that wants testimonials to feel effortless and premium—without the friction of sliders or pagination.

Key Features

Infinite vertical scroll animation with seamless looping
1, 2, or 3 column layout via dropdown control
Independent scroll speed per column for natural visual rhythm
Gradient fade mask (top & bottom) for polished edge transitions
Optional header section with badge, title, and subtitle
Editable fonts for title and body via Framer Font controls
Customizable border color and background color
Avatar support with responsive image control
Up to 30 testimonials via Array property control
Testimonials auto-distributed across columns (round-robin)
Safari-compatible mask with WebKit fallback
Smooth framer-motion animation, no external dependencies
Works on canvas and published site

Where to Use

SaaS landing pages and pricing pages
Agency and studio websites
Product and feature pages
Startup launch pages
Portfolio and personal brand sites
Case study and social proof sections
Any page that needs trust signals without taking up interaction bandwidth

Best For

Teams that want always-moving social proof without user effort
Brands looking for a clean, modern alternative to sliders and carousels
Designers who want full typographic and color control from the Properties panel
Framer users who need a drop-in testimonial section with zero config

Why This Component

Carousels require clicks. Static grids get scrolled past. Scrolling Testimonials sits in the sweet spot—motion that draws the eye without demanding interaction. Multiple columns at staggered speeds create a natural, organic feel that makes your page feel alive. The gradient mask keeps it elegant, and the property controls let you dial in every detail without touching code.

Built for Framer. Drop it on your canvas and publish.

68:T809,

AmbientFX brings cinematic motion and atmosphere to your Framer projects through GPU-batched canvas animations. It transforms any frame into a living surface with five built-in pattern modes, each fully customizable to match your brand and mood.

✨ Features:

Five pattern modes — Choose between dots, lines, waves, grid, and particles. Each one is hand-tuned to feel alive without ever stealing focus from your content.
Full color control — Pick any background and pattern color independently. Pair them for high-contrast statements or near-monochrome ambient layers.
Density & speed controls — Dial in the exact level of motion and detail, from subtle breathing textures to dense kinetic fields.
Drop-in or wrapper mode — Use it as a standalone background or place any layer inside it. Children stack cleanly above the canvas with no z-index headaches.
Fit content, fill, or fixed — Works in every Framer layout mode. Set it as a hero background, a card surface, or a section divider.
Editor-friendly — Toggle between live animation and a static editor preview to keep your canvas snappy while designing.
Performance first — Draw calls are batched into alpha buckets, layout reads happen only on resize, and DPR is capped at 2 for crisp visuals without burning GPU.
Zero dependencies — Pure Canvas 2D, no external libraries. Loads instantly and adds nothing to your bundle.
Fluid layouts — A built-in ResizeObserver keeps the pattern sharp at any container size, on any breakpoint.

With AmbientFX, every section becomes a tactile, motion-aware surface — from minimal grid lattices to dreamy particle drifts. Designed to disappear behind your content while quietly making everything feel more alive.

69:T48a,

A fully customizable typewriter effect for Framer - Made by ONYRI Strategy

How it works

The component displays a static prefix followed by animated text that types character by character, pauses, deletes, then moves to the next text in the list. A blinking cursor follows the typed text throughout.

Features

— Static prefix with independent color (supports emoji)

— Multiple cycling texts with configurable type/delete speeds

— Blinking cursor with customizable character ("_", "|", "▌")

— Three independent color controls: prefix, typed text, cursor

— Full font control (family, weight, size, line height)

— Text alignment: left, center, or right

— Loop toggle to stop after the last text

— Responsive: wraps gracefully on all screen sizes

— SSR-safe with hydration protection

— Canvas-optimized: static preview in editor, animation only in preview/published

Property controls

Prefix · Typed Texts · Type Speed · Delete Speed · Wait Time · Loop · Cursor · Cursor Char · Prefix Color · Typed Color · Cursor Color · Font · Alignment

62:["$","$L63",null,{"value":{"fallback":{"$inf$activity-creator-092b6e6a-5b7e-4e19-9a5a-4352c205c584-all:/unified/creator/092b6e6a-5b7e-4e19-9a5a-4352c205c584/activity/":[{"data":[{"id":"01a08168-bcad-732c-9bb1-43f33b649e05","type":"component.created","target":{"type":"component","id":"rsPB2Y9s1a9dgtBDlXV3","preview":"Testimonial Grid Pro","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/092b6e6a-5b7e-4e19-9a5a-4352c205c584/01a0804e-06f4-74ec-948e-5b7ad2771404.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","slug":"onyri-strategy","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"component","visibility":"public","startedAt":"2026-09-08T14:25:20.045Z","latestAt":"2026-09-08T14:25:20.045Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:092b6e6a-5b7e-4e19-9a5a-4352c205c584:/unified/posts/?creator=092b6e6a-5b7e-4e19-9a5a-4352c205c584&with=reposts":[{"data":[{"id":"01a08168-bab5-76ad-8e19-02b95060b79c","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"rsPB2Y9s1a9dgtBDlXV3","resolved":true,"title":"Testimonial Grid Pro","body":"$64","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Testimonial Bento arranges customer quotes into an asymmetric bento grid and reveals them one card at a time as visitors scroll. Three card styles and per-card placement let you compose a wall that looks arranged, not generated."}]},{"type":"customHeading","content":[{"type":"text","text":"Key Features","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Three card styles: Light with a blueprint grid, Dark, and Accent Sequential scroll reveal in reading order, with editable stagger, duration, offset, blur, trigger point, and once-or-always replay"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Three layouts from one component: 3-column bento, horizontal row groups, single stack Per-card column and size weight, so your composition survives every breakpoint "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Container-based responsiveness, with both breakpoints editable "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Three-level avatar fallback: upload, URL, built-in artwork, then an initials placeholder Retina avatars at 128/192/256px, roughly 8KB each instead of 90KB Optional baseline rule with editable width, thickness, offset, color, and end caps 49 controls plus 8 per testimonial, including 5 fonts and 14 colors "}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Respects reduced motion, and shows the finished layout on the canvas 7 pre-loaded testimonials, works on Framer Canvas and published sites"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Where to Use","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Landing page social proof, SaaS trust sections, agency client walls, case-study roundups, course and community testimonials."}]},{"type":"customHeading","content":[{"type":"text","text":"Best For","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Teams with a handful of strong quotes rather than dozens, designers who want an editorial arrangement instead of an even grid, and Framer users who need full visual control without code."}]},{"type":"customHeading","content":[{"type":"text","text":"Why This Component","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Unlike a uniform testimonial grid or an auto-scrolling marquee, Testimonial Bento treats placement as a design decision. You choose which column each quote sits in and how much room it claims, and that composition survives every breakpoint: on tablet the columns lie down as rows instead of being reshuffled into arbitrary halves. The reveal follows reading order, so the wall assembles itself in front of the visitor."}]},{"type":"paragraph","content":[{"type":"text","text":"Built for Framer. Drop it onto your canvas, customize it, and publish."}]}]},"introduction":"Testimonials that reveal on scrol","slug":"testimonial-grid-pro","author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/092b6e6a-5b7e-4e19-9a5a-4352c205c584/01a0804e-06f4-74ec-948e-5b7ad2771404.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-09-08T14:25:18.969Z","updatedAt":"2026-09-09T09:38:35.117Z","publishedAt":"2026-09-08T14:25:18.966Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/Macos-xzl7JE.js@hZPDCufvhjM2iKjciKIg","previewUrl":"https://testimonial-pento-pro.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"hZPDCufvhjM2iKjciKIg","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":1,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-08T14:25:19.541Z","updatedAt":"2026-09-08T14:25:19.541Z"},{"id":"019ea7b9-8463-7f2c-b4f6-b77a1a874152","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"2PqESLm0bEUJsfUNhzhz","resolved":true,"title":"Image Showcase Pro","body":"

Live Preview : https://image-showcase-pro-by-os.framer.website/

Features:

Scroll-to-expand animation with forward and reverse
Supports image, MP4 video, and YouTube embed
Fullscreen or custom media size mode
Split title animation with mix-blend-mode option
Dark overlay with adjustable opacity
Customizable fonts (title) and colors (title, labels, background)
Child content slot revealed after full expansion
Touch and wheel input support
SSR-safe with hydration fallback
Canvas preview for Framer editor

","bodyJson":null,"introduction":"Scroll-driven hero with expanding media","slug":"image-showcase-pro","author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/xfEz1vUhQtGs8hgHkOJ5/image-showcase-pro-JZh1oa5MVQNQiCxQjYZ7d4tJiqejgg","metadata":{"tint":{"h":210,"s":22,"l":14},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-09T09:53:37.196Z","updatedAt":"2026-06-08T14:53:25.550Z","publishedAt":"2026-06-08T14:53:33.667Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://image-showcase-pro-by-os.framer.website/","price":"9","paymentUrl":"https://buy.polar.sh/polar_cl_zJCru6j6r82VuCmr462w3rhjNGCyde0875h7t1XQx3A","workshop":false,"categories":[{"id":"1a3a0eb3-698e-461a-bf42-2502a7ed43e0","name":"Backgrounds","slug":"backgrounds"}],"lastSaveId":"rmbtGHROLWhAxljHmJpB","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-08T14:53:33.667Z","updatedAt":"2026-06-08T14:53:33.667Z"},{"id":"019e9bed-dfa2-7d06-907e-d4d319582163","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"9PjXeXxuJfs0Rs0PjmZ7","resolved":true,"title":"Pricing Plans Pro","body":"$65","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Pricing Plans Pro","marks":[{"type":"bold"}]},{"type":"text","text":" is a polished, interactive pricing picker for SaaS and tiered products. It combines an animated billing toggle, expandable feature drawer, and live user-based pricing in one connected interface. Visitors can compare plans without leaving the page, while the component adapts seamlessly from mobile to desktop."}]},{"type":"customHeading","content":[{"type":"text","text":"Key Features"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Vertical or Horizontal layout with automatic frame resizing"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Animated Monthly/Yearly toggle with customizable discount badge"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Up to 8 plans with names, descriptions, monthly/yearly prices, and features"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Live price calculation based on user/seat count with smooth animations"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Configurable user counter with +/- controls, starting value, and label"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"12 currencies via native "},{"type":"text","text":"Intl.NumberFormat","marks":[{"type":"code"}]},{"type":"text","text":": USD, EUR, GBP, JPY, CAD, AUD, CHF, CNY, INR, BRL, MXN, SGD"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Feature separators using newlines or "},{"type":"text","text":"|","marks":[{"type":"code"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Optional custom user and feature icons"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Animated feature drawer with sequential slide-up effects"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Responsive CTA with hover and tap animations"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"9 editable font controls and extensive color customization"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Container-based responsiveness using ResizeObserver, with compact mode below 380px"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"3 pre-loaded plans: Plus, Standard, Advanced"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Works on both Framer Canvas and published sites"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Where to Use"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Ideal for SaaS pricing, per-seat subscriptions, storage and infrastructure tiers, bootcamps, memberships, communities, APIs, and developer tools."}]},{"type":"customHeading","content":[{"type":"text","text":"Best For"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Teams selling tiered products with per-user pricing, designers needing one responsive component, and Framer users who want complete visual control without coding."}]},{"type":"customHeading","content":[{"type":"text","text":"Why This Component"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Unlike static three-column pricing grids or stepper modals, "},{"type":"text","text":"Pricing Plans Pro","marks":[{"type":"bold"}]},{"type":"text","text":" keeps everything connected. The active plan reveals its features, pricing updates instantly as seats change, and the same component switches between mobile-stacked and desktop-horizontal layouts through a single property."}]},{"type":"paragraph","content":[{"type":"text","text":"Built for Framer. Drop it onto your canvas, customize it, and publish."}]}]},"introduction":"Live-price plan picker","slug":"pricing-plans-pro","author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/9PjXeXxuJfs0Rs0PjmZ7/pricing-plans-pro-WyhpyKYJSDzIGeDrLbylvfwlnAgGu3","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-27T09:49:12.030Z","updatedAt":"2026-09-07T20:01:29.641Z","publishedAt":"2026-06-06T07:55:18.306Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://pricing-card-by-onyri-strategy.framer.website/","price":"9","paymentUrl":"https://buy.polar.sh/polar_cl_jJzvL7rbaFA8l3SY1QeUGyRM1wifE1cAfbFcm2oRWUZ","workshop":false,"categories":[{"id":"7677fa83-43ce-41a2-a3fe-db438ec0fd33","name":"Interactive","slug":"interactive"}],"lastSaveId":"yB2wPbQ0rv7jAZJmpPVu","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":55,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-06T07:55:18.306Z","updatedAt":"2026-06-06T07:55:18.306Z"},{"id":"019e9be1-94f8-7359-b85b-345fbd996866","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"FMISPHE9YXpBPGd4VBFv","resolved":true,"title":"Country Accordion","body":"$66","bodyJson":null,"introduction":"Show every country you serve, by region","slug":"country-accordion","author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/FMISPHE9YXpBPGd4VBFv/country-accordion-wd2WPyJncpbLkzdmkC08f7S75Fu1jx","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-27T06:38:46.931Z","updatedAt":"2026-06-05T16:37:56.375Z","publishedAt":"2026-06-06T07:41:52.760Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/CountryAccordion-eO0kf3.js@gXrcjhYN6bgZpmRvY9EM","previewUrl":"https://country-accordion-made-by-onyri-strategy.framer.media/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"cf876fb8-579b-4a79-8604-b7feed61bcb0","name":"Accordions","slug":"accordions"}],"lastSaveId":"gXrcjhYN6bgZpmRvY9EM","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":11,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-06-06T07:41:52.760Z","updatedAt":"2026-06-06T07:41:52.760Z"},{"id":"019dd225-b409-7df7-96fc-69041c049f59","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"k5VTJw0P6is7eQvL5H0b","resolved":true,"title":"Testimonials Pro","body":"$67","bodyJson":null,"introduction":"Scrolling Testimonials displays reviews ","slug":"testimonials-pro","author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/k5VTJw0P6is7eQvL5H0b/testimonials-pro-3Lyz1xhA249fG0l72fh24f7wL3WaTg","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-16T09:21:32.328Z","updatedAt":"2026-05-17T07:57:34.843Z","publishedAt":"2026-04-28T03:32:59.529Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://testimonial-pro-by-os.framer.website","price":"9","paymentUrl":"https://buy.polar.sh/polar_cl_fBPRv7cUQJtbotZEO1QzOwH5kz45SPJVEdB7R0KbV1l","workshop":false,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"XiAiEu7DPNwLagEzeCxh","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":11,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-28T03:32:59.529Z","updatedAt":"2026-04-28T03:32:59.529Z"},{"id":"019dbb86-93b0-758e-996f-390c78578275","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"P4udvJf6sb0a6gOZMLv4","resolved":true,"title":"AmbientFX","body":"$68","bodyJson":null,"introduction":"Live canvas backgrounds","slug":"ambientfx","author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/uadkIOI0YFJ1UMwNiWf7/ambientfx-WHqpASNebfWPvGPhtLi8GLacV8zb3K","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-07T14:28:08.222Z","updatedAt":"2026-09-07T20:24:36.339Z","publishedAt":"2026-04-23T18:07:32.272Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://ambientfx-by-os.framer.website/","price":"7","paymentUrl":"https://buy.polar.sh/polar_cl_AfxM5ChRuNR5jnVlLkg89GsTISBf77QRC4wPQ3jN5TC","workshop":false,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"syoMdBonoouxn8BGSne6","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":23,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-23T18:07:32.272Z","updatedAt":"2026-04-23T18:07:32.272Z"},{"id":"019d9205-c5a4-74ea-9b37-4608c80f4b39","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"2o0eqTBbfN8wtn0THoPk","resolved":true,"title":"TypeScript","body":"$69","bodyJson":null,"introduction":"Animated typewriter with prefix & cursor","slug":"typescript","author":{"framerUserId":"092b6e6a-5b7e-4e19-9a5a-4352c205c584","name":"ONYRI Strategy","slug":"onyri-strategy","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/1412066/avatar-kHGXusqZB1syGd3pNBioephGEmuqkO.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/2o0eqTBbfN8wtn0THoPk/typescript-PYAf1A4NkWnAuN4bLYMtvaGmAbsHne","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-04-07T20:24:56.517Z","updatedAt":"2026-06-13T03:58:31.738Z","publishedAt":"2026-04-15T16:42:25.060Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/Typescript-SVGvJb.js@PuX1eIM5Sfns3BMdqgMO","previewUrl":"https://typescript-by-os.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"7fe42fdd-1b16-4f5a-93b8-009488614de8","name":"Text","slug":"text"}],"lastSaveId":"PuX1eIM5Sfns3BMdqgMO","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":23,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-04-15T16:42:25.060Z","updatedAt":"2026-04-15T16:42:25.060Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L6a"}]