Search for a command to run...
Check these 5 online tools next time before starting to design your new app.
Creating apps built with ❤️ using Oracle APEX. PL/SQL dev. Exploring the AI and ML world. Keen on front-end, visual arts and new technologies. Love travel, sports, photography.
Love this! Here is a set of links that I have used when I'm looking for the right type of chart to tell my data's story:
BTW - I'm not affiliated with any of these. Just sites I've found interesting in the past.
Impressions from APEX Alpe Adria 2026
The Use Case Oracle APEX has a special template for Dialog Pages, called Drawer. This template is also available for any Region on you Page (this time called Inline Drawer). 💡 A Drawer is an overlay
The Use case (and the issue) What you see on this screenshot is a pretty common requirement in an APEX application - A form, where you have some text item or dropdown menu, followed by a button or som
The power of Claude Code - offline, free, secure
Using a REST Media Resource as an image source
On this page
The application User Interface is crucial. If someone opens your app, their initial impression may impact whether they decide to stay or leave forever. In the context of an APEX-created application, we benefit from the already well-thought design, colours and functionality. In the cases when we'd like to go with something different, however, the design principles must be followed, the right colours that match each other should be selected, and the layout should be created in a convenient and pleasant to the user way.
Having said that, I understand that not everyone, including me, is a UI expert. Most of the APEX developers are people with a database background, so UI is probably not the strongest topic for us. That's why I've always tried to look for help when building a new app. Here are some of the tools that I've used. Hope they are as useful to you, as they've been to me.
I'm starting with colours, as this is probably the first thing we start changing in the Theme Roller when designing a new Theme Style. It's easy, it's quick, but the results could be very unpleasant if we don't choose the right colours. Combining colours is a whole science so I often use a special website to get inspiration and colour palettes that have been selected by people who know what they're doing.
🔗 https://coolors.co/palettes/trending
Benefits of using this website:
Gives you pre-made colour palettes, together with their HEX codes when you hover over
Generates colour palettes from photos, so you can simply upload a screenshot from a website or any design you like and Coolors will generate the palette for you
Can check your custom-made palette for bad contrast
Can adjust your custom-made palette for people with colour blindness if needed
Suggests the text colour that should be used for certain colours from the palette
Another very useful tool when speaking about colours is the Chrome browser and especially the Dev Tools. What's interesting is an experimental feature called CSS Overview. To enable it, select the three dots in the top right corner of Dev Tools. Then select More Tools/CSS Overview.
Now open a website with a nice UI and colours you like. Once on the CSS Overview tab in Dev Tools, click on Capture overview button. It will generate a full CSS report of the website, including colours used, fonts used, as well as the CSS media queries used on the site. Having all that information, you can try to replicate the colour scheme and fonts in your application.
No doubt that the font is one of the components that we notice immediately when opening a website or an application. Choosing the right fonts could also be a tricky job as some could be good for titles and headings, but not as good for paragraphs and other blocks of text. We need to pick readable, legible and web-safe ones. A font should also correspond with our brand's identity and audience. We can not put a cartoon font on a business application for example. Luckily again there are plenty of places online to help us pick the best ones, as well as download and use them.
Here are some serious portals that are focused on UI and can help you build a better one, including helping you pick the right fonts:
Having an idea of the type of fonts you need, Google Fonts is a great place to get one. They provide you with the option to select multiple font styles, group them and add them to your web app. There is a sample CSS code that you should just copy/paste. Here is an example of how you can set the Roboto font as a default one for your APEX application:
@import url('https://fonts.googleapis.com/css2?family=Roboto+Serif:opsz,wght@8..144,100&family=Roboto:wght@100&display=swap');
:root {
--a-base-font-family: Roboto;
}
And if new colours and fonts are not enough as a change for your application, take a look at the Component Gallery website. It has a huge library of all major brands' Design Systems and Components. You can select from buttons, cards, checkboxes, inputs, dropdowns and file uploads... Every component you can think of - it's there. Select the one you'd like to check and the site will redirect you to the documentation with examples included.
Here I have selected some websites that maintain a library with some of the most beautiful and interesting designs. If you struggle to come up with your own idea, you can always take inspiration from elsewhere.
🔗 UX Crush - it is built around Figma - one of the most popular design tools, recently acquired by Adobe. You can find numerous templates, play around with them in Figma and get the CSS to replicate them in a web app.
🔗 Behance UI/UX - a space where the best designers share their work. An excellent opportunity to get inspired for your next app.
🔗 Screenlane - this website has compiled screenshots of all possible screens from the most popular apps, grouped by categories and types of components included in the app - cards, timelines, calendars and so on.
🔗 Godly - another compilation of beautiful web interfaces you can inspire by. Could filter on type, style, libraries used, etc.
And what better tool for creating good UIs than good books, an articles or a course on the subject? I don't say I've read them all, but it's a good idea to try to educate ourselves with some good reads. Here is a list of some places where such materials are available.
🔗 Coursera - UI / UX Design Specialization
🔗 freeCodeCamp - UI / UX Design Tutorial – Wireframe, Mockup & Design in Figma
🔗 AdobeXD - User Experience Design Course with Adobe XD Course
🔗 Skillshare - Popular UI/UX Design Classes
🔗 Hackdesign - Curated and structured lessons in the form of a course. They cover all sorts of UI/UX topics, including best design practices for Mobile Web applications, Desktop applications, etc.
Like that post? Follow me on Twitter and LinkedIn!
🔷 @plamen_9 on Twitter
🔷 Plamen Mushkov on LinkedIn
