Prompting app UI & design
Prompt your UI or upload your Figma/tldraw sketches , Databutton ensures to write React code based on your inputs!
Last updated
Was this helpful?
Prompt your UI or upload your Figma/tldraw sketches , Databutton ensures to write React code based on your inputs!
Last updated
Was this helpful?
The most effective way to build the user interface you want (if you know what you want) is to give a pretty precise ask.
I want this page to have: 1. An ruby colored navigation bar card on top saying "ChatYourPdf" 2. A light grey white background gradient 3. A white card on the left for preview of PDFs that says "Add PDF" in the middle, and that pops-up a popup on click 4. A card with a full chat on the right with a messages box, a place to enter messages, and a submit button. 5. I want all buttons to be black with white text and square corners 6. Make sure that the PDF preview card is identical in size to the chat card
I want to build an SEO helper app. It should have 1. a big black navigation bar saying "SEO Wizard", 2. a white input card with shadow in the middle where users enters a url with "https://www.databutton.com" as placeholder. Ensure that the card is not small and says "Enter your url" 3. A big "Suggest posts" button in solid black with white text as part of the input card
You can make your app's design much more unique and aesthetically pleasing with a single prompt
Example prompt:
I want you to do a design critique of #Home, come with suggestions for how we can radically change the design for the better, make it unique, and really stand out, and then implement those suggestions. Write all suggestions out loud so that I can approve before continuing.
Grab your favourite Fonts from and ask the Agent to change it. It works seamlessly.
Click "Get font"
Copy Embed code
Use this prompt:
can we use this font? [+ embed code below]