Skip to content
INZIU INZIU.cc

Componenten

Alle UI-componenten in dit project

Formulier / Form

Button varianten, formaten & statussen
Input labels, iconen & statussen

Inclusief https://

Textarea meerregelige invoer met hint

Ondersteunt markdown-opmaak

Select keuzelijst opties
Checkbox met omschrijving & uitgeschakelde status
Radio standaard & kaart-variant
Switch formaten & statussen

Schakel over naar een donker kleurthema.

Gegevensweergave / Data Display

Avatar formaten
Avatar Avatar
Avatar Avatar
Avatar Avatar
Avatar Avatar
Avatar Avatar
AvatarGroup gestapeld met overflow
Anna Anna
Mark Mark
Sara Sara
Tom Tom
+2
Badge varianten, pil & puls
Default Success Warning Error Info Brand Pil Live
Card varianten

Default

Lorem ipsum dolor sit amet consectetur adipiscing elit.

Outline

Lorem ipsum dolor sit amet consectetur adipiscing elit.

Elevated + hover

Lorem ipsum dolor sit amet consectetur adipiscing elit.

Solid

Lorem ipsum dolor sit amet consectetur adipiscing elit.

Ghost

Lorem ipsum dolor sit amet consectetur adipiscing elit.

Table gestreepte rijen
Naam Rol Status
Anna de Vries Designer Actief
Mark Jansen Developer Actief
Sara Bakker Product Manager Afwezig
Tom Smit QA Engineer Actief
Progress bepaald, varianten & onbepaald
Uploaden... 35%
Skeleton laad-placeholders
GoogleMap ingesloten kaart (setup-status)

Google Maps

Add PUBLIC_GOOGLE_MAPS_API_KEY to your .env file to enable the map.

Terugkoppeling / Feedback

Alert varianten & sluitbaar
Toast getriggerde meldingen
Tooltip posities
Tooltip boven Tooltip onder Tooltip links Tooltip rechts

Overlay / Overlay

Accordion kaart-variant, exclusief
Wat is INZIU?
INZIU is een persoonlijke website en component-speeltuin om UI-patronen te bouwen en te tonen.
Hoe werkt het?
Elke component heeft een eigen map met varianten, stijlen en gebruiksvoorbeelden.
Kan ik deze componenten herbruiken?
Ja, elke component op deze pagina is een echte, werkende instantie.
ConsentBanner cookiebanner (alleen actief indien ingeschakeld)

We gebruiken cookies om je ervaring te verbeteren. Privacybeleid

Dialog modaal met footer-acties
Dropdown menu met iconen & scheiding
Tabs horizontale tabbladen
Hier staat een kort overzicht met willekeurige inhoud.
Meer gedetailleerde inhoud voor dit tabblad.
Instellingen-gerelateerde inhoud.
VerticalTabs met iconen & omschrijvingen
Profielinhoud (willekeurige tekst).
Beveiligingsinhoud (willekeurige tekst).
Meldingen-inhoud (willekeurige tekst).

Marketing / Marketing

CTA invert-variant
Klaar om te beginnen?
Sluit je aan bij honderden gebruikers die al met deze componenten bouwen.
SocialProof avatars + vertrouwentekst

Vertrouwd door 500+ tevreden gebruikers

Logo formaten & letter-monogram
INZIU INZIU INZIU INZIU I
Wordmark merktekst
INZIU.cc
NpmCopyButton kopieer-naar-klembord commando

Layout / Layout

Separator horizontaal, met label & verticaal
Links Rechts

Inhoud / Content

CodeBlock met bestandsnaam & regelnummers
example.ts
1 function welkom(naam: string) {
2 return `Hallo, ${naam}!`;
3 }
4
5 console.log(welkom('Dennis'));

Primitieven / Primitives

Icon voorbeeld iconenset
menu
search
mail
phone
heart
star
shield
globe
sun
moon
zap
code
check-circle
alert-circle
info
github

Apps, tools,
en experimenten.

Een onsamenhangende verzameling webapps. Categorieën: Games, Kennis, Productiviteit, Lifestyle.

Niet omdat ik denk dat het beter kan, over het algemeen experimenten. En aan de uitkomst of werking kunnen geen rechten ontleend worden. LOL

Alle relics

Wat AI-vooruitgang buiten beschouwing laat

AI-systemen zijn geoptimaliseerd voor outputmaximalisatie, niet voor werkelijk begrip. Empirisch rijst de vraag wie de structurele systeemrisico's onderzoekt, terwijl energieverbruik exponentieel stijgt, trainingsdata depleteren en besluitvorming zich onttrekt aan adequaat institutioneel toezicht.

AI Head