Introducing HMIcons
We’ve spent hundreds of hours crafting this graphics library, specifically for SCADA and industrial automation applications.
@for (product of products; track product.id) <product-card [data]="product" />
const userResource = resource( request: () => this.userId(), loader: async ( request, abortSignal ) => return fetch(`/api/users/$request`, signal: abortSignal ) .then(res => res.json()); ); 4.1 Zoneless Change Detection By disabling Zone.js and relying on signals, applications become faster and more predictable. An expert configures:
@Component( standalone: true, template: ` <input [(ngModel)]="searchTerm" /> <p>Resultados para: filteredItems().length </p> ` ) export class SearchComponent searchTerm = model(''); items = input.required<Item[]>(); filteredItems = computed(() => this.items().filter(i => i.name.includes(this.searchTerm())) );
@defer (on viewport) <heavy-chart /> @placeholder <div>Cargando gráfico...</div>
@if (user.isLogged) <user-profile /> @else <login-button />
For data fetching, the new resource() and rxResource() APIs replace complex RxJS chains:
This improves performance and readability. One of the most powerful features for beginners to grasp is @defer :
Feature
Each of our 150 and counting unque graphics is delivered in five file formats, including SVG, JPG, PNG, AI, and EPS.
Your download includes our original vector design files, the pre-exported SVG files and all other common graphics formats with multiple sizes. Raster graphics are pre-exported for you at 1x, 2x and 3x sizes.
Feature
The full collection includes over 150 custom designed, unique graphics for your industrial pplication. From buttons and gauges to the hyper-specific emulsifiers and conveyor grahics, this package has you covered.
Feature
Our industrial graphics are 100% vector, and include the source files.
This enables you to easily change the size, scale and colors of your graphics.
@for (product of products; track product.id) <product-card [data]="product" />
const userResource = resource( request: () => this.userId(), loader: async ( request, abortSignal ) => return fetch(`/api/users/$request`, signal: abortSignal ) .then(res => res.json()); ); 4.1 Zoneless Change Detection By disabling Zone.js and relying on signals, applications become faster and more predictable. An expert configures: angular: de cero a experto - edición 2025
@Component( standalone: true, template: ` <input [(ngModel)]="searchTerm" /> <p>Resultados para: filteredItems().length </p> ` ) export class SearchComponent searchTerm = model(''); items = input.required<Item[]>(); filteredItems = computed(() => this.items().filter(i => i.name.includes(this.searchTerm())) ); @for (product of products; track product
@defer (on viewport) <heavy-chart /> @placeholder <div>Cargando gráfico...</div> @for (product of products
@if (user.isLogged) <user-profile /> @else <login-button />
For data fetching, the new resource() and rxResource() APIs replace complex RxJS chains:
This improves performance and readability. One of the most powerful features for beginners to grasp is @defer :
