Lorenzo Bocchi

Say hello

LinkedInBehanceDribbbleInstagram
Let's chat

Components

Accordion

l

Reusable UI components, brand assets, content tooling, and shared product patterns.

Yes. Each panel accepts any React content, including lists, links, and structured layouts.

Yes. It uses GSAP for smooth height transitions while keeping interaction accessible.

m

Reusable UI components, brand assets, content tooling, and shared product patterns.

Yes. Each panel accepts any React content, including lists, links, and structured layouts.

Yes. It uses GSAP for smooth height transitions while keeping interaction accessible.

Badge

xxl

BadgeBadgeBadgeBadgeBadge

xl

BadgeBadgeBadgeBadgeBadge

l

BadgeBadgeBadgeBadgeBadge

m

BadgeBadgeBadgeBadgeBadge

Banner

default / stack

information / inline

success / stack

warning / inline

error / stack

Breadcrumbs

chevron separator

slash separator

body text style

label text style

Button Social

xxl

xl

l

m

Button

xxl

xl

l

m

Calendar Double

action: empty

Description

Helper text

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Calendar

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Checkbox

default

with title

with title and description

bare

Copy to Clipboard

button trigger

Copied!

inline text trigger

npm install @s25/platformCopied!

Dialogue

dialogue

drawer

sidebar

Dropdown

default + search

with description + helper

Description

Helper text

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Embed

xxl

Description

Embed preview

Paste embed markup to see a live preview.

Helper text

xl

Description

Embed preview

Paste embed markup to see a live preview.

Helper text

l

Description

Embed preview

Paste embed markup to see a live preview.

Helper text

m

Description

Embed preview

Paste embed markup to see a live preview.

Helper text

Hyperlink

body (default)

Visit our website

label style

Label link

leading icon

Link with icon

trailing icon

External link

Input Badges

xxl

Description

ReactTypeScript

Helper text

xl

Description

ReactTypeScript

Helper text

l

Description

ReactTypeScript

Helper text

m

Description

ReactTypeScript

Helper text

Input Field

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

leading icon

trailing icon

Input Group

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Input Numeric

xxl

xl

l

m

Input Password

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Input Payments

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Input Social

xxl

Description

Helper text

Description

Helper text

Description

Helper text

xl

Description

Helper text

Description

Helper text

Description

Helper text

l

Description

Helper text

Description

Helper text

Description

Helper text

m

Description

Helper text

Description

Helper text

Description

Helper text

Notification

l

12

m

12

s

12

Pagination

l

m

s

Radio

default

with title

with title and description

bare

Rich Text Area

xxl

Description

0 characters0 words

Helper text

xl

Description

0 characters0 words

Helper text

l

Description

0 characters0 words

Helper text

m

Description

0 characters0 words

Helper text

Search

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Segmented Control

l

Overview content

Details content

Activity content

m

Overview content

Details content

Activity content

s

Overview content

Details content

Activity content

Selector Color

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Selector Country

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Selector Currency

xxl

Description

AFN

Helper text

xl

Description

AFN

Helper text

l

Description

AFN

Helper text

m

Description

AFN

Helper text

Selector Phone

xxl

Description

+93

Helper text

xl

Description

+93

Helper text

l

Description

+93

Helper text

m

Description

+93

Helper text

Share

all platforms

selected platforms

Slider

xxl

35
20 – 70

xl

35
20 – 70

l

35
20 – 70

m

35
20 – 70

Spinner

xxl

xl

l

m

Stepper

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Swiper

slide effect

Slide One

Slide Two

Slide Three

fade effect

Slide One

Slide Two

Slide Three

Switch

l

Label

m

Label

s

Label

Tabs

xl

Tab 1 content

l

Tab 1 content

m

Tab 1 content

s

Tab 1 content

Table

default

Team members
NameRoleStatus
Alice ChenDesignerActive
Ben MartinezEngineerActive
Clara DavisProductAway

striped

Team members
NameRoleStatus
Alice ChenDesignerActive
Ben MartinezEngineerActive
Clara DavisProductAway

bordered

Team members
NameRoleStatus
Alice ChenDesignerActive
Ben MartinezEngineerActive
Clara DavisProductAway

xxl

NameRoleStatus
Alice ChenDesignerActive
Ben MartinezEngineerActive
Clara DavisProductAway

xl

NameRoleStatus
Alice ChenDesignerActive
Ben MartinezEngineerActive
Clara DavisProductAway

l

NameRoleStatus
Alice ChenDesignerActive
Ben MartinezEngineerActive
Clara DavisProductAway

m

NameRoleStatus
Alice ChenDesignerActive
Ben MartinezEngineerActive
Clara DavisProductAway

Text Area

xxl

Description

Helper text

xl

Description

Helper text

l

Description

Helper text

m

Description

Helper text

Toast

xxl

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

xl

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

l

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

m

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

Entry published

Homepage content is now live.

Tooltip

top

right

bottom

left

Uploader

xxl

Drag & Drop file here

or upload a filefrom your computer

We accept images, videos, and documents

xl

Drag & Drop file here

or upload a filefrom your computer

We accept images, videos, and documents

l

Drag & Drop file here

or upload a filefrom your computer

We accept images, videos, and documents

m

Drag & Drop file here

or upload a filefrom your computer

We accept images, videos, and documents

Validation

Strength: 50%

Password Requirements

  • At least 8 characters
  • Contains one uppercase letter
  • Contains one number
  • Contains one special character

Avoid passwords that you use with other websites or that might be easy for someone else to guess.

Video Player

native controls

Add a video source to preview media.

custom controls

Add a video source to preview media.

Skeleton

block

text (3 lines)

block large

Progress

free / primary

free / neutral

segmented / primary