Form

Preview

Identity

First Name

Last Name

We'll never share your email

Company Search

Debounced Search Input

Account Security

Password

AT Least 8 Characters

Confirm Password

Profile Details

AGE

Start Date

BIO

Resume

No file chosen

PDF OR Word Document

Preferences

Country

Language

Primary Framework

Interests

Select ONE OR More

Satisfaction

Brand Color

oklch(55% 0.2 264)

Plan

Subscription

Free

PRO

Enterprise

Agreements

Email ME Product Updates

I Accept THE Terms OF Service

import { Component } from '@angular/core';

import { XButton } from '@xngui/components/button';

import { XCheckbox } from '@xngui/components/checkbox';

import { XColorPicker } from '@xngui/components/color-picker';

import { XCombobox } from '@xngui/components/combobox';

import { XDatepicker } from '@xngui/components/datepicker';

import { XFileUpload } from '@xngui/components/file-upload';

import { XForm, XFormField } from '@xngui/components/form';

import { XInput } from '@xngui/components/input';

import { XNumberInput } from '@xngui/components/number-input';

import { XPasswordInput } from '@xngui/components/password-input';

import { XRadio } from '@xngui/components/radio';

import { XRadioGroup } from '@xngui/components/radio-group';

import { XSearchInput } from '@xngui/components/search-input';

import { XSelect } from '@xngui/components/select';

import { XSlider } from '@xngui/components/slider';

import { XSwitch } from '@xngui/components/switch';

import { XTextarea } from '@xngui/components/textarea';

@Component({

selector: 'app-example',

imports: [XButton, XCheckbox, XColorPicker, XCombobox, XDatepicker, XFileUpload, XForm, XFormField, XInput, XNumberInput, XPasswordInput, XRadio, XRadioGroup, XSearchInput, XSelect, XSlider, XSwitch, XTextarea],

templateUrl: './form.component.html',

})

export class ExampleComponent {}

Interact with the preview — events will appear here.