# Creating Refractive 3D Text in Hana - Spline Academy (https://spline.design/academy/tutorials/creating-refractive-3d-text-in-hana)

> Learn how to create stunning 3D text effects in Hana using the new 3D Shape effect.

1. [Academy](https://spline.design/academy)
2. [Tutorials](https://spline.design/academy/tutorials)
3. Creating Refractive 3D Text in Hana

# Creating Refractive 3D Text in Hana

HanaBeginner7 min

Learn how to create stunning 3D text effects in Hana using the new 3D Shape effect.

In this tutorial, we'll show you how to transform flat text into interactive 3D typography with glass-like refractive materials, dynamic lighting, plus smooth animations. Perfect for designers looking to add depth and visual interest to their projects!

⏲️ Chapters

- 00:00 Intro
- 00:29 Start adding your text
- 00:56 Adding 3D shape effect to the text
- 02:31 Duplicating text
- 02:59 Glass material
- 03:56 More effects
- 04:27 Adding motion
- 05:24 Final touches
- 05:53 Outro

## Related resources

- [3D Design TextTemplate](https://app.spline.design/academy/tutorials/creating-refractive-3d-text-in-hana?redirect-duplicate-template-uuid=e3d0aa9a-4962-43ea-9880-6d9a2c625103&is-2d-file=true)
- [Designing in HanaDocument](https://docs.spline.design/hana-a-canvas-for-interactivity/designing-in-hana)
- [Effects in HanaDocument](https://docs.spline.design/hana-a-canvas-for-interactivity/effects-in-hana)

## Overview

- Hana
- 7 min
- Beginner

## Part of

- [Hana | Everything You Need To Know](https://spline.design/academy/collections/hana-everything-you-need-to-know/creating-refractive-3d-text-in-hana)

## Related tutorials

[All tutorials](https://spline.design/academy/tutorials)

[Design and Animate with Vector MasksHanaBeginner7 min](https://spline.design/academy/tutorials/design-and-animate-with-vector-masks)[Explore 3D Projections and Noise EffectsHanaBeginner8 min](https://spline.design/academy/tutorials/explore-3d-projections-and-noise-effects)[How to Use AI Image Generation in HanaHanaBeginner8 min](https://spline.design/academy/tutorials/how-to-use-ai-image-generation-in-hana)

[Spline](https://spline.design/)

The 3D and 2D editor for teams and their agents. Ship to the web, iOS and Android.

#### Ask AI about Spline

#### Products

- [3D Design](https://spline.design/3d-design)
- [Hana](https://spline.design/hana)
- [Omma](https://omma.build)
- [AI 3D Generation](https://spline.design/ai-generate)
- [Spline MCP](https://spline.design/mcp)
- [Pricing](https://spline.design/pricing)
- [Enterprise](https://spline.design/enterprise)

#### Runtimes

- [Web](https://spline.design/web)
- [iOS](https://spline.design/ios)
- [Android](https://spline.design/android)

#### Apps

- [Download](https://spline.design/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Download Spline Mirror](https://spline.design/download-mirror)

#### Learn

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [Solutions](https://spline.design/solutions)

#### Community

- [Spline Community](https://community.spline.design)
- [Blog](https://spline.design/blog)
- [Changelog](https://spline.design/changelog)
- [Education](https://spline.design/education)
- [Contra](https://spline.design/contra)
- [Affiliate](https://spline.design/affiliate)

#### Company

- [Customers](https://spline.design/customers)
- [Careers](https://www.ycombinator.com/companies/spline/jobs)
- [Security](https://spline.design/security)

#### Legal

- [Terms & Conditions](https://spline.design/terms)
- [Privacy](https://spline.design/privacy)

#### Contact

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.