# Progressive blur en gradiënten in Hana - Spline blog (https://spline.design/nl/blog/introducing-progressive-blur-gradients)

> Til je designs naar een hoger niveau met blurs en gradiënten die het oog strelen

[Blog](https://spline.design/nl/blog)

27 mei 2025

# Progressive blur en gradiënten in Hana

Til je designs naar een hoger niveau met blurs en gradiënten die het oog strelen

[Open Hana](https://app.spline.design)

Progressive blurs werden een paar jaar geleden populair met de glazen UI-esthetiek van iOS en winnen de laatste tijd terrein in tools voor UI-design. Toch is het vooral een complexe techniek gebleven die lastig te gebruiken is in motion design of in realtime interactieve omgevingen.

Vandaag brengen we realtime progressive blurs naar Hana. Voor het eerst is dit soort blur in realtime beschikbaar, met intuïtieve bediening en zonder technische kennis, allemaal op het oneindige designcanvas van Hana.

Speel met de scène hieronder om te zien hoe het werkt.

Hover of tik om te interacteren (ervaring gemaakt met Hana)

## Zo voeg je progressive blur toe in Hana

Selecteer een laag en voeg Layer Blur of Background Blur toe. In beide gevallen kies je of de blur Uniform of Progressive moet zijn.

Een progressive blur werkt eigenlijk net als een gradiënt, maar in plaats van tussen kleuren loopt hij over tussen twee waarden voor de blur-radius.

Zo werkt progressive blur in Hana

## Vloeiende gradiënten in Hana

Je kunt nu gradiënten maken in Hana. Je kiest uit lineaire, radiale of polaire gradiënten en past de positie direct op het canvas aan.

We introduceren ook Smooth Gradients: gradiënten die een Smooth Step-interpolatie gebruiken voor natuurlijkere overgangen tussen kleuren. De meeste designtools gebruiken gradiënten met lineaire interpolatie, wat zichtbare breekpunten oplevert tussen de kleuren van elke "stop" in de gradiënt.

We introduceerden Smooth Gradients een paar jaar geleden eerst in de 3D-editor van Spline, en nu brengen we ze naar Hana.

## SVG-imports en meer

De afgelopen weken hebben we ook verschillende verbeteringen aan Hana uitgebracht, waaronder ondersteuning voor SVG-bestanden (je kunt ze nu gewoon naar binnen slepen), betere prestaties en een kleinere runtime.

Daarnaast hebben we het werkgemak op verschillende punten verbeterd, met onder meer een kleurkiezer die beter werkt, verbeterde selectietools en talloze kleine fixes voor een consistentere ervaring.

Ervaringen gemaakt met Hana

## Probeer het nu!

Hier is een [Spline Hana-bestand](https://app.spline.design/ui/f7cc3864-707e-492a-8148-0e1ea37be1d3) waarmee je de mogelijkheden van progressive blur en gradiënten kunt verkennen.

## Designworkflows veranderen

Hoe eenvoudig deze nieuwe functies in de kern ook zijn, ze geven je meer creatieve controle en creatieve resultaten dan ooit tevoren.

Zulke animaties of realtime interacties maken was nooit eenvoudig, en nu doe je het in een paar seconden met Hana.

We zijn benieuwd wat je gaat bouwen!

—

Het Spline-team

[Meer info](https://docs.spline.design/doc/what-is-hana/doccoU2VnAOm)

## Meer van de blog

[3 november 2026Maak kennis met Spline Arena](https://spline.design/nl/blog/introducing-spline-arena)[21 oktober 2026Maak kennis met Spline voor ChatGPT](https://spline.design/nl/blog/introducing-spline-for-chatgpt)[27 augustus 2026Maak kennis met Hana V2](https://spline.design/nl/blog/hana-v2)

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

De 3D- en 2D-editor voor teams en hun agents. Publiceer op het web, iOS en Android.

#### Vraag AI naar Spline

#### Producten

- [3D-design](https://spline.design/nl/3d-design)
- [Hana](https://spline.design/nl/hana)
- [Omma](https://omma.build)
- [3D genereren met AI](https://spline.design/nl/ai-generate)
- [Spline MCP](https://spline.design/nl/mcp)
- [Spline Arena](https://spline.design/nl/arena)
- [Prijzen](https://spline.design/nl/pricing)
- [Enterprise](https://spline.design/nl/enterprise)

#### Runtimes

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

#### Apps

- [Downloaden](https://spline.design/nl/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Spline Mirror downloaden](https://spline.design/download-mirror)

#### Leren

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

#### Community

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

#### Bedrijf

- [Klanten](https://spline.design/nl/customers)
- [Vacatures](https://www.ycombinator.com/companies/spline/jobs)
- [Beveiliging](https://spline.design/nl/security)

#### Juridisch

- [Algemene voorwaarden](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.
