An open API service indexing awesome lists of open source software.

awesome-angular

:page_facing_up: A curated list of awesome Angular resources
https://github.com/PatrickJS/awesome-angular

Last synced: 7 days ago
JSON representation

  • Third Party Components

    • File Upload

      • ngx-file-helpers - Angular file helpers including a file picker and dropzone.
      • file-uploader - A Web Components–based file upload widget compatible with any JavaScript framework — React, Next.js, Vue, Angular, and Svelte — without adapters.
      • ngx-accessible-dropzone - A tiny, zero-dependency, fully accessible drag-and-drop file upload component for Angular with keyboard and screen-reader support.
      • @h-k-dev/angular-file-drop - A lightweight Angular drag‑and‑drop directive for files and folders with traversal, filtering, and click‑to‑pick—no stylesheets, no XHR, no DOM mutation.
    • Form Controls

      • ngx-color - Color Pickers from Sketch, Photoshop, Chrome, GitHub, X, and more.
      • ngx-color-picker - Color picker widget.
      • angular-colorful - A tiny color picker component for modern Angular apps.
      • ng-select - All in One UI Select, Multiselect and Autocomplete.
      • file-input-accessor - Angular directive that provides file input functionality in Angular forms.
      • ngx-filesaver - Simple file save with [FileSaver.js](https://github.com/eligrey/FileSaver.js).
      • ngx-bar-rating - Angular Bar Rating.
      • angular-code-input - Robust Angular input component (numbers/chars) for Angular 7–16+, with Ionic 4–7, mobile, and clipboard support.
      • angular-iban - IBAN directives and pipes for Angular.
      • ngx-autosize-input - An Angular directive that automatically adjusts the width of an input element. It shrinks and increases the width.
      • angular-cc-library - Library to support Credit Card input masking and validation.
      • ngx-ui-switch - A simple iOS 7 style switch component for Angular.
      • auto-complete - Angular Auto Complete component and directive.
      • ngx-otp-input - One time password input library for Angular.
      • ngx-show-hide-password - Add split input button to password or text input. Toggles input type between "text" and "password".
      • ngx-phone-field - Angular directive for international phone input with flag dropdowns, supporting Reactive and Template-Driven Forms.
      • ngx-rabe-star - An Angular library that provides a customizable star rating component for your Angular application.
      • ngx-countries-dropdown - Angular library with customizable countries dropdown component with flags, dial code, language and currency details.
      • ngx-morse - A simple morse code encoder and decoder for Angular.
      • ngx-mat-split-button - Angular Material split button with a primary action and dropdown for secondary options.
      • ng-select2 - An updated fork of [select2-component](https://github.com/plantain-00/select2-component).
      • ngx-duration-picker - Angular component for ISO_8601 durations.
      • ngx-super-select-tree - A single/multiple choice drop down tree for Angular!
      • ngx-easy-emoji-picker - Angular library that seamlessly integrates emoji selection into your application.
      • ngx-mat-table-multi-sort - Add multi-sort capability to an Angular Material table.
      • ngx-virtual-select-field - This package replicates the Angular Material Select component with virtual scroll capabilities with help of cdk-virtual-scroll.
      • ng-country-select - A smart, multilingual country search with flags and codes.
      • ngx-card-wrapper - Angular >=16 wrapper for [card.js](https://github.com/jessepollak/card), which provides a credit card form.
      • ngx-cron - User-friendly cron input.
      • @amirsavand/ngx-input - Awesome all-in-one Angular package for inputs and forms handling.
      • ngx-pwd - Password Strength Meter and Generator.
      • ngx-emoji-mart-next - Customizable Slack-like emoji picker.
      • ng-otp-input - A fully customizable, one-time password (OTP) input component for the web built with Angular.
      • ngx-np-datepicker - Angular datepicker supporting the Nepali (Bikram Sambat) calendar with easy form integration.
      • ngx-multi-select-input - Modern Angular standalone component for multi-term input with chips, autocomplete, and color support—ideal for tag editors and search bars.
      • rm-ng-star-rating - A fully customizable and feature-rich Angular standalone component for advanced star ratings with precision and responsive design.
      • ngx-input-color - `ngx-input-gradient` and `ngx-input-color` are customizable Angular components for color/gradient picking with previews and form integration.
      • ngxsmk-tel-input - An Angular telephone input component with country dropdown, flags, and robust validation/formatting.
      • gradient-picker - A powerful and beautiful gradient picker.
      • ngxsmk-datepicker - A modern, highly customizable Angular date range picker component.
      • ngx-country-selector - A sleek, customizable Angular Material country selector offering accessible dropdowns with flags, codes, local names, and more.
      • @nsnayp1/angular-datepicker2 - Lightweight Angular 16+ datepicker with standalone support, range and multi-date selection, and customizable templates—no external dependencies.
      • ngx-phone - Angular phone input with auto country detection, real-time formatting, validation, and full forms support.
      • ngx-phone-country-input - Comprehensive Angular library for phone input and country selection with reactive forms support.
      • ngx-mat-period-picker - A modern Angular Material period picker component built with standalone components.
      • touchspin-angular - Angular adapter for the [TouchSpin](https://github.com/istvan-ujjmeszaros/touchspin) number input component with per-renderer support.
      • ngxsmk-otp-input - Lightweight standalone Angular 17+ OTP/PIN input with SCSS theming, autofill, masking, and reactive forms support.
      • ngx-cron-editor - Graphical Angular 15+ cron builder with reactive forms integration and Material Design styling.
      • ngx-otp-code-input - An Angular OTP input component with extensive customization options, including masking, numeric-only input, and autofocus.
      • smart-date-input - A smart date input directive that uses the Writer API to parse natural language dates.
      • color-picker - Another beautiful color picker.
      • ngx-mat-birthday-input - An Angular Material library for entering a birthday.
      • ngx-pattern-lock - A lightweight, fully responsive, and customizable Android-style pattern lock component for Angular.
      • ngx-super-select - A multi-select input component for Angular.
      • smt-select - A high-performance, lightweight, and customizable Angular select component with built-in virtual scroll and search capabilities.
      • ngx-mat-searchable-select - A reusable Angular Material select component with infinite scroll, debounced search, "no items found" feedback, and static/mock data support.
      • ngx-animated-paginator - Angular wrapper for [animated-paginator-web-component](https://www.npmjs.com/package/animated-paginator-web-component) that plugs seamlessly into template-driven and reactive forms via `ControlValueAccessor`.
      • mat-password-meter - Angular Password Strength Meter ([zxcvbn](https://github.com/dropbox/zxcvbn), NIST-aligned, customizable).
      • nicematic-emoji-picker - High‑performance, zero‑dependency emoji picker for Angular 17+ with 929 emojis, auto‑theming, i18n, and responsive design.
      • ngx-starflow - A lightweight Angular component for displaying fractional star ratings with full precision.
      • combobox - An all‑in‑one Angular Select solution with built‑in multiselect and autocomplete features.
      • BlossomColorPicker - A polished, blooming color picker for the Web, offered as a standalone JS library with lightweight wrappers for Angular, React, Vue, and Svelte.
      • ngx-intl-phone-input - Accessible, headless Angular international phone input with CDK-powered country selector.
      • ngx-colors2 - A material‑style Angular color‑picker updated for Angular 20+, using signals and no animation dependencies.
      • ngx-signal-datetimepicker - Angular datetime picker built on Signal Forms — date + time in one control, zero deps, WCAG 2.2 AAA out of the box.
      • ngx-multi-field-dropdown - A customizable Angular searchable dropdown component with multi-field search support.
      • angular-multiselect-dropdown - A maintained Angular multiselect dropdown built for template-driven and reactive forms.
      • @koenz/angular-datepicker - An animating datepicker for Angular 21+.
      • ngx-dual-rangepicker - Dual-calendar date range picker for Angular 20+ and Angular Material M3.
      • ngx-libs-workspace - A small family of reactive form controls—built on Signal Forms, customizable via CSS custom properties, and free of Angular Material, Angular CDK, and `ControlValueAccessor`.
    • Forms

      • angular-imask - Angular input mask.
      • ngx-mask - Angular Plugin to make masks on form fields and html elements.
      • maskito - Collection of libraries to create an input mask which ensures that user types value according to predefined format.
      • ng-signal-forms - Signal powered Angular Forms.
      • ngx-sub-form - Utility library for breaking down an Angular form into multiple components.
      • ngx-reactive-forms-utils - Utilities to assist in the use of reactive Angular forms.
      • ngx-vest-forms - A lightweight, type-safe adapter linking Angular template-driven forms with [Vest.js](https://vestjs.dev/) for complex, async validation.
      • ngx-currency - Currency mask module for Angular.
      • ngx-super-forms - This library adds some much-needed features on top of Angular forms and Reactive forms, to make it more developer friendly.
      • tripetto - Tripetto’s FormBuilder SDK offers customizable components for building and deploying forms. Use this [quickstart](https://tripetto.com/sdk/docs/getting-started/usage-with-angular/) to integrate with Angular.
      • @paddls/ngx-form - Model based typed reactive forms made easy.
      • ngx-enhancy-forms - Fancy enhanced Angular forms.
      • ngx-forms-core - This library extends Angular’s form system with strictly typed classes and tools to enhance type safety.
      • ngx-focus-entities - Library for generating reactive Angular forms from a Focus4 representation generated with [TopModel](https://github.com/klee-contrib/topmodel).
      • @TanStack/form - With TypeScript support, headless UI, and framework-agnostic design, it streamlines cross-framework form handling.
      • @luistabotelho/angular-signal-forms - Simple Angular library to implement forms with signals.
      • ngx-form-object - An abstraction over Angular reactive forms that generates forms from models and manages nested relationships.
      • reactive-form-extensions - This project enhances Angular ReactiveForms with input trimming, error messages, and validation-based CSS—without extra dependencies.
      • pro-form - A predefined set of reactive and reusable form input components based on Angular Material.
      • ngx-forms - Collection of Angular form functions, that will help you build your applications.
      • @klubinskak/ngx-smart-forms - Smart, Signal-powered form state utilities for Angular 17+.
      • @pixelbyaj/ngx-form - ISO20022 Angular Forms use XSD/XML to design HTML forms and structure MX messages.
      • ngx-custom-controls - Angular library with a base directive (BaseCvaImplementationDirective) that simplifies custom form controls with built-in validation.
      • ngxAccessor - This library adds a third approach to Angular forms, integrating signals alongside existing methods with adaptability.
      • angular-template-signal-forms - A modern Angular form library built from the ground up with Signals — flexible, type-safe, and fully themeable.
      • ngx-formidable - A powerful Angular component library for building rich, validated forms.
      • piying-view - A strongly typed frontend form solution; an alternative to `ngx-formly` and Angular's official form framework.
      • ngx-form-m3 - Persian form library for Angular and Material 3.
      • lite-form - A lightweight Angular library offering customizable form components with validation, styling, and animations.
      • cc-form-engine - Advanced Angular library for reactive form generation and management with dynamic validation, change tracking, and customizable error messages.
      • ngx-autosave-forms - Autosave form values in localStorage using template forms or reactive forms in Angular.
      • ngx-better-forms - Streamlined, maintainable reactive form utilities.
      • ngx-query-builder - Angular query builder with standalone components, sensible defaults, templating hooks, and full form support for domain-specific editors.
      • ngx-mat-form - Angular library that uses Reactive Forms and Angular Material to dynamically generate configurable forms from a schema.
      • ng-forge - A type‑safe, dynamic forms library built for Angular’s signal‑based forms.
      • zignal - A type-safe Angular form library using signals and Zod validation, with Turkey-specific validators and multi-language support.
      • ngx-currency-v2 - A fork of [ngx-currency](https://github.com/nbfontana/ngx-currency) updated for the latest Angular version.
      • ngx-form-stepper - A strongly typed Angular library for building robust multi‑step forms that prevent invalid states during development with minimal configuration.
      • ngx-form-rules - A lightweight Angular library that makes it easy to enable, disable, and control reactive form fields using simple, declarative rules.
      • ngx-entity-forms - Generates fully typed Angular FormGroups from your entity interface, complete with autocompletion, validation, and error messages.
      • ngx-form-draft - Zero-dependency Angular form draft auto-save and restore.
      • ngx-signal-forms - A signal‑driven, type‑safe Angular form library built on the experimental Signal Forms API with modern M3 styling.
      • formsync - A developer‑friendly Angular‑ready form backend that lets you collect and manage submissions without server‑side code.
      • @neutro-web/form - High-performance, zero-dependency, framework-agnostic reactive form engine.
      • forge-form - Generates reactive, signal-based forms, validation, and conditional fields from a single TypeScript object.
      • NgSimplicityForms - Composable Angular dynamic forms framework with shared core APIs and renderer packages for Bootstrap and Angular Material.
      • ng-modular-forms - A lightweight architectural layer with built-in components for modular Angular reactive forms.
    • Form Validation

      • ngx-valdemort - Simpler, cleaner Angular validation error messages.
      • validointi - This is a library to help you validate your template driven forms.
      • angular-reactive-validation - This library simplifies Reactive Forms validation by eliminating the need for extensive HTML.
      • ngx-formcontrol-errors - A directive for showing errors in Angular form controls.
      • ngx-validator-pack - A collection of validators designed
      • ngx-error-msg - The error message mapping library for Angular.
      • ngx-reactive-form-class-validator - A lightweight library for dynamically validate Angular reactive forms using [class-validator](https://github.com/typestack/class-validator) library.
      • ng-error-tooltips - Angular reactive forms library that shows error tooltips for user-friendly validation messages.
      • ngx-forms-validator - A forms validator library for Angular.
      • ngx-control-message - A library for binding a message to a synchronous or asynchronous form control validator.
      • safari-numfix - A lightweight utility to safely handle paste and keydown events on number input fields in Safari.
      • ngx-input-errors - Angular Reactive Forms library that auto-displays validation errors with multi-language and custom message support.
      • error-message - Lightweight Angular library for flexible, standardized validation error display and management.
      • ng-reactive-form-validate - Angular library for streamlined form validation with customizable messages, Transloco integration, and styled error labels.
      • angular-password-checker - Protect your users from re-using a password known to be hacked with this simple Angular directive.
      • translation-validation - Automatic validation messages for Angular forms in any language.
      • polish-validators - A validation library designed for Polish-specific formats, also available as an Angular wrapper via [ngx-polish-validators](https://www.npmjs.com/package/ngx-polish-validators).
      • ngx-mat-errors - Offers a simple and adaptable approach to presenting error messages within a `MatFormField`.
      • oop-validator - Powerful, flexible validation library for any UI framework—Vue, React, Angular, and more—for complete front-end validation.
      • ngx-cross-field-validation - Angular library providing conditional, equality, inequality, and sequence-based validations on form controls.
      • validauth - Lightweight, powerful authentication validators for JavaScript applications.
      • ngx-validation-messages - This module simplifies the display of form validator messages by using a single component.
      • ngx-validators - A library that provides additional Angular Validators, including the ones Angular provides.
    • Icons

      • angular-fontawesome - Official Angular component for Font Awesome 5+.
      • ng2-fontawesome - A small directive making font awesome even easier to use.
      • ng-icons - The ultimate icon library for Angular.
      • primeicons - The default icon library of PrimeNG with over 250 open source icons developed by PrimeTek.
      • angular-svg-icon - Angular component and service for inlining SVGs allowing them to be easily styled with CSS.
      • @ngneat/svg-icon - A lightweight library that makes it easier to use SVG icons in your Angular Application.
      • Angular-Svg-Sprite - Simplify Angular SVG icon usage with flexible, manageable SVG sprites.
      • ng-hero-icons - Use [Heroicons](https://heroicons.com) in your Angular application.
      • ngx-fluent-ui - Angular & online library for Microsoft Fluent UI icons.
      • angular-remix-icon - Angular wrapper for Remixicon icon library.
      • angular-line-awesome - Angular Line Awesome is an Angular component to manage [Line Awesome](https://icons8.com/line-awesome) icons.
      • angular-tabler-icons - This package allows you to use the [Tabler Icons](https://tabler.io/icons) in your Angular applications.
      • ngx-fast-svg - SVGs, fast and developer friendly in Angular.
      • angular-techs-logos - Library of tech related icons.
      • ngx-x-browser-svg-mask - Directive to easily achieve cross browser compliance while creating SVG masks.
      • coolshapes - An Angular library aiming at allowing developers to use cool-looking abstract shapes with little grainy gradients from [coolshapes](https://coolshap.es/).
      • Semantic Icons - A collection of free and open source icons ready for use in your Angular projects using the component attribute selector and the SVG tag.
      • lucide - Open-source icon library with 1000+ SVGs, featuring an [official Angular package](https://lucide.dev/guide/packages/lucide-angular) for easy integration.
      • angular-phosphor-icons - Set of components designed for utilizing [Phosphor Icons](https://phosphoricons.com/) in Angular via directives.
      • @ngverse/icons - Angular library that allows you to use popular open-source icons as regular components.
      • ic-on - The future of iconing.
      • ngxi - Comprehensive SVG icon set for Angular with seamless integration of thousands of popular icons.
      • chill-wind-icons - Dynamic Angular icon library with native Tailwind CSS support, tree-shakeable icon data, and built from Iconoir SVGs.
      • @TSB04/svg-icon - Framework-agnostic, customizable, lightweight SVG icon package for React, Vue, Angular, and more.
      • Semantic Icons - Free, open-source icon collection for Angular projects via component selector and SVG tag.
      • animated-icons - Animated icons for Angular based on [moving icons](https://www.movingicons.dev/).
      • hugeicons-angular - 5,100+ free MIT-licensed stroke-rounded icons for Angular.
      • @quikturn-sdk/logos-angular - TypeScript SDK for the [Quikturn Logos API](https://getquikturn.io/) - Fetch any company's logo by domain name.
      • @hugeicons/angular - 5,400+ free MIT-licensed stroke-rounded icons for Angular.
      • GeoIcons - Geographic map icons for every country, territory, and world region as tree-shakable Angular standalone components.
    • Images

      • cloudinary - Angular SDK from Cloudinary.
      • ngx-image-hero - Hero animation package for smooth, clickable image zoom into immersive view.
      • ngx-image-cropper - An image cropper for Angular.
      • unpic - Angular directive for responsive, high-performance images with automatic srcset, sizing, and CDN/CMS URL detection.
      • ngx-advanced-img - Angular attribute directives suite that provides various HTML img feature extensions.
      • ngx-img-cropper - Image cropping tool for Angular.
      • ngx-smart-cropper - Angular standalone image uploader with crop, resize, drag-and-resize, grid overlays, and aspect ratio support.
      • ngx-annotorious - Angular wrapper for [Annotorious V3](https://annotorious.dev/), a library that adds annotations to images.
      • ngx-easy-image-drawing - Angular library for easy image drawing on a canvas.
      • ngx-blurhash-render - Lightweight Angular 15+ library for rendering image blurhash, requiring [blurhash](https://www.npmjs.com/package/blurhash) dependency.
      • ngx-pinch-zoom - This module enables image zooming and positioning through touch screen gestures.
      • ngx-broken-img - Angular directive to fix broken url in img. If image url returns 404, a placeholder is used to fill img's src.
      • @jjmhalew/ngx-lightbox - A [lightbox2](https://github.com/lokesh/lightbox2) implementation port to use with Angular >= 18 (zoneless).
      • ngx-avatars - Spiritual successor to [ngx-avatar](https://github.com/HaithemMosbahi/ngx-avatar).
      • ngx-image-compression - A lightweight image compression and conversion library for Angular.
      • ng-cropper - Angular image cropper built on `CropperJS` with customizable interface and optional toolbar for seamless cropping.
      • ngx-ratio-image - Angular library for displaying an image with a variable aspect ratio inside a container with a fixed aspect ratio.
      • ngx-image-magnifier - Angular image magnifier directive with keyboard modifier support, smart positioning, mobile optimization, and smooth GPU-accelerated animations.
      • ngx-image-fallback - Image Fallback Directive for Angular.
      • @necraidan/ngx-lightbox - A lightweight, accessible Angular 21+ lightbox with zoom, pan, pinch‑to‑zoom, and keyboard navigation, all with zero dependencies.
      • ng-image-optimizer - A high‑performance Angular SSR image optimizer that uses [Sharp](https://sharp.pixelplumbing.com/) to deliver a Next.js‑style experience.
      • ngx-image-forge - An Angular image editing library — crop, rotate, flip, and export images with zero dependencies. Signals-native.
    • JSON Forms

      • ngx-formly - JSON powered / Dynamic forms for Angular.
      • formio - JSON powered forms for Angular.
      • fluent-form - Building dynamic form in Angular with Fluent API or JSON.
      • jsonforms - Customizable JSON Schema-based forms with React, Angular and Vue support out of the box.
Sub Categories
Angular 255 Third Party Components 175 Wrappers 94 UI Libraries 82 Free Templates 71 Form Controls 70 Mixed Utilities 69 Internationalization 59 AI 58 Forms 47 HTTP 47 Data Grids 45 Animations 44 Other State Libraries 41 Authentication 40 Editors 40 Google Developer Experts on X 38 CLI Tools 38 Blogs 37 Notifications 37 Charts 35 Scroll 33 Generators and Scaffolding 33 YouTube Channels 32 External Integration 32 Analytics 31 Loaders 31 Icons 30 RxJS 30 Dates 29 TypeScript 27 Carousels 25 Layout 25 UI Libraries built on Tailwind CSS 25 Helpers 24 NgRx 23 Directives 23 Form Validation 23 Component 22 Official Resources 22 Images 22 DOM 22 UI Libraries built on Material 21 File Upload 21 IDE Extensions 20 Training 20 Accessibility 20 Drag and Drop 19 Deployment 19 Books 19 Builders 19 Visual Effects 19 Media 19 Router 19 Community 19 Feature Flags 18 Modals 18 Calendars 18 UI Library and Framework Ionic 18 Markdown 17 Viewers 17 Storage 17 Captcha 17 Updating Angular 16 Performance 16 Linting 15 Code Analysis 15 Pipes 15 E2E 15 Styling 15 Maps 14 JSON Forms 14 Angular Team on X 14 QR Codes 13 Security Best Practices 12 Documentation Tools 12 Onboarding and Product Tours 12 Runtime 12 Keyboard Mouse 12 Debugging 11 UI Libraries built on Bootstrap 11 Cross-Framework Integration 11 Tooltips 11 NGXS 11 Paid Templates 11 Payments 10 Cheat Sheets 10 Server-Side Rendering 10 Desktop Applications 10 Role-Based Access Control 10 Angular Experts on X 10 Exercises 9 Loggers 9 GraphQL 9 UI Primitives 9 PDF 8 Podcasts 8 Cookies 8 Module Federation 8 SEO 7 Certification Programs 7 Newsletters 6 Networking 6 Micro-Frontends 5 CSV 5 Layout Components 4 Editor Components 4 Printing 4 Guides 3 Monorepos 3 Style Guides 3 Editor and IDE Extensions 2 Bluesky 1