Trencadís Animated HTML website template

The sample page

Els Bocins. Family trencadís workshop in Gràcia.

The idea

The family’s broken plates become a trencadís ring around the workshop sign, glued in one piece at a time.

What to try

Watch two hands glue the mosaic, then move your cursor so each shard catches the light at its own angle; tap one to hear it ring like china.

Made for

Ceramic studios, mosaic makers, interior design and hotels

Palette

• #F2F2EE
• #2B6CB0
• #E9B949
• #3FA34D
• #D64933
• #1C1C1C

Typefaces

Federo + Nunito

Cultural notes

• An original mosaic shape, with no copies of Gaudí’s or Jujol’s work.
• Text sits on the plain plaque or the wall, never on the mosaic.
• Shards come in many sizes, with calm single-color zones.

The HTML

What you download

• A single index.html file with nothing to install: open it, swap in your brand and copy, and upload it to your hosting.
• In English and Spanish, tested on desktop and mobile.
• Instructions for changing copy, colors, language and prices, plus its license.