>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3544132. --> Reported by: [utkarsh_33](https://www.drupal.org/user/3727088) Related to !46 !26 !1504 >>> <h3 id="overview">Overview</h3> <p>While creating a code component the AI should get a context of existing styling of the site. This will help the AI to create similar type of components that closely match the styling of the site.<br> In this issue we are focusing on JS components only. </p> <h3 id="proposed-resolution">Proposed resolution</h3> <p>So if a user wants to create a new component using AI then to match the component with the theme of the website we need to tell LLM about the current styling of the existing components.<br> In this issue we fetch all the available JS components on the site and create a style guide which includes the components that can be helpful for the creation of a new component. We take the JS and CSS associated with the component along with the Global CSS for the site, which acts as a source of information for the LLM on how the styling/theming of the current site is. Keeping the style guide in mind the LLM then creates new components that matches the theme/styling of the site.<br> We have also taken care of the scenario when the user upload an image and says "Create a similar component", then we are not considering style guide and create a components which matches the image.</p> <h3 id="ui-changes">User interface changes</h3>