Add Elements

1. Models

Brokenatom can generate UI based on the User Inputed Model and its design system. Model to UI compiler is what sets us apart from other no-code platforms. Either create your data model, Generate Models with AtomAI or Copy the models from the Blocks. When you select the component you need from the many models and CRUD operations. The UI is generated almost instantly with our Proprietary compiler.

(i) Model name => Model Single: Fetches one item from the data model. Click on this to add to the selected container. (ii) Model name => Model List: Retrieves all items from the data model. Click on this to add to the selected container. (iii) Model name => Model Create Form: Adds a new item to the data model. Click on this to add to the selected container. (iv) Model name => Model Update: Modifies an existing item in the data model. Click on this to add to the selected container. (v) Model name => Model Get selected one: Retrieves a specific item from the data model based on selection criteria. Click on this to add to the selected container. (vi) Filters: To apply a filter hover over the “Model List” and then select the required filter from the list. Filters allow you to refine the results when retrieving multiple items from the data model. Click on this to add to the selected container. Adding a filter to existing data model “Model List”: Select the “Model List” container, navigate to the models in add element, and select from the list of “Model List”.

1. Components

(i) How to add components: Search the required component in the search bar and click to add it to the selected container. Put it in the Add element same for everything. (ii) List of components: 1. Counter 2. Profile 3. List 4. Table 5. Alert 6. Navbar 7. Loading 8. Progress 9. Header 10. Footer (1 & 2) 11. Cards 12. Carousel 13. Gallery 14. Speeddial 15. Pagination 16. Login form 17. Radio 18. Checklist 19. Form 20. Button 21. Progress bar 22. Audio 23. Video 24. Location 25. Calendar 26. Map 27. Bar chart 28. Pie chart 29. Line chart 30. Radial chart 31. QR code generator 32. Stopwatch 33. Page list 34. Accordion 36. Marquee

1. Layout: Readymade layouts: Add and modify as you want

1. Headers 2. Hero Sections 3. Features 4. Gallery 5. Contact 6. Footer 7. Blog 8. Content 9. Pricing 10. Stats 11. Steps 12. Team 13. Testimonials 14. Ecommerce

d. Navigation: Coming soon!

e. Text: Coming soon!

1. Icons

1. Lucide: Search for the icons you need, and click to add in the container.

2. Custom Icons: Add icons in assets (Custom library coming soon)

g. Images

1. Pexels: Search the image library and click to add the image

2. Unsplash: Search the image library and click to add the image

h. GIFs

Giphy: Search the gif library and click to add the gif

i. Embed (coming soon!)

1. YouTube

2. Twitter

3. iframes