Hi Everyone,
I'm new to develop webgui by using luci on openwrt. I need to create my own webgui style like below picture:
Does anyone can help me?
Many Thanks!
What is your level of coding background?
Luci / Lua is pretty challenging IMHO... Basic colors and icons based on an existing theme layout would be do-able ( in my world )... any major layout / backend mods tho' would be months of work... and that's for the deft coder...
Start with your favorite theme, un minify things... then poke around with the css and fgrep.... easy? 
Thank you for your quickly reply! wuify23
Basically, I work in embedded software. I know little about html . css and javascipt. But I never using luci/lua before. TBH, this problem is related to my new project. I have no idea how to create webgui style like the picture I post before.
So I ask here for some help. 
Keep in mind that luci is still seeing active development, so keeping on top with luci development and adapting to changes there will require continued effort.
1 Like
You "just" need to edit the CSS files, and you can use the default theme, and some others already available, as an example. See how each theme works, what is different among them, pick one closer to your target, and start modifying it.
2 Likes
If it's a very custom deployment with pre-defined set of features, you can use a different web-server/language which you are more familiar with to develop the UI.
If you're planning on allowing additional luci applications to be installed, you have to use the current luci framework, so your only option would be to design a new theme.
If it is a commercial thing, I'd try to hire the developer of luci-theme-rosy to help you. If it isn't, check out the source code of luci-theme-bootstrap, luci-theme-material and luci-theme-rosy for the inspiration.
1 Like
Thank you for reply! eduperez
I have to follow the picture I post before because the customer's request.
Yes, it's commercial thing. But I have the limit of customer budget and time. The deadline is less three months from now. Wish me luck! Hope the custermization of WebGui style have compromise.
Thank you! stangri
Do you have to just mimic the look and feel, or replicate all the functionality too?
1 Like
eduperez
I need replicate all the functionality ,too. Not just mimic the look and feel. I must make it work on the feature show on the WebGui.
Thank you for your reply.
I just hope we have a miscommunication issue here, and you have not being asked to replicate all the functionalities and applications from that router in OpenWrt, in three months... For example, are you expected to add an "AiCloud 2.0" button (and whatever it does) to OpenWrt?
Hi eduperez,
Yes, it's a miscommunication. I mean I need create webgui the picture I post before. Not mean the same feature as Asus wifi route have. I need ont only basic feature of openwrt but some specific feature my customer's request. So I also need add new item on my own create webgui.
BTW. It might be done new feature on a new web page, not exactly the same as the original luci webgui.